reset清除所有浏览器默认样式
温馨提示
reset 的目的不是清除浏览器的默认样式, 这仅是部分工作. 清除和重置是紧密不可分的.
reset 的目的不是让默认样式在所有浏览器下一致, 而是减少默认样式有可能带来的问题.
reset 期望提供一套普适通用的基础样式. 但没有影响, 推荐根据具体需求, 裁剪和修改后再使用.
一.设置及注释
- /** 清除内外边距 **/
- body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
- dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
- pre, /* text formatting elements 文本格式元素 */
- form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
- th, td /* table elements 表格元素 */ {
- margin: 0;
- padding: 0;
- }
- /** 设置默认字体 **/
- body,
- button, input, select, textarea /* for ie */ {
- font: 14px/1.5 tahoma, \5b8b\4f53, sans-serif;
- }
- h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal;}
- address, cite, dfn, em, var { font-style: normal; } /* 将斜体扶正 */
- code, kbd, pre, samp { font-family: courier new, courier, monospace; } /* 统一<a href="https://www.baidu.com/s?wd=%E7%AD%89%E5%AE%BD%E5%AD%97%E4%BD%93&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1YLPjcvPvmkPW9WPWRLPj-b0ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3En16srjm1rjcL" target="_blank" class="baidu-highlight">等宽字体</a> */
- small { font-size: 12px; } /* 小于 12px 的中文很难阅读, 让 small 正常化 */
- /** 重置列表元素 **/
- ul, ol { list-style: none; }
- /** 重置文本格式元素 **/
- a { text-decoration: none; }
- a:hover { text-decoration: underline; }
- sup { vertical-align: text-top; } /* 重置, 减少对行高的影响 */
- sub { vertical-align: text-bottom; }
- /** 重置表单元素 **/
- legend { color: #000; } /* for ie6 */
- fieldset, img { border: 0; } /* img 搭车:让链接里的 img 无边框 */
- button, input, select, textarea { font-size: 100%; } /* 使得表单元素在 ie 下能继承字体大小 */
- /* 注:optgroup 无法扶正 */
- /** 重置表格元素 **/
- table { border-collapse: collapse; border-spacing: 0; }
- /* 重置 HTML5 元素 */
- article, aside, details, figcaption, figure, footer,header, hgroup, menu, nav, section,
- summary, time, mark, audio, video {
- display: block;
- margin: 0;
- padding: 0;
- }
- mark { background: #ff0; }
二.实际应用代码
建议做网站的时候,设置个reset.css样式表清除各个浏览器的默认样式,已达到做的网页在各个浏览器中达到统一,下面把YUI Reset CSS代码贴出
- body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
- margin:0;
- padding:0;
- }
- table {
- border-collapse:collapse;
- border-spacing:0;
- }
- fieldset,img {
- border:0;
- }
- address,caption,cite,code,dfn,em,strong,th,var {
- font-style:normal;
- font-weight:normal;
- }
- ol,ul {
- list-style:none;
- }
- caption,th {
- text-align:left;
- }
- h1,h2,h3,h4,h5,h6 {
- font-size:100%;
- font-weight:normal;
- }
- q:before,q:after {
- content:'';
- }
- abbr,acronym {
- border:0;
- }
reset清除所有浏览器默认样式的更多相关文章
- reset.css(重置浏览器默认样式)
@charset "utf-8";html{background-color:#fff;color:#000;font-size:12px} body,ul,ol,dl,dd,h1 ...
- css清除浏览器默认样式
css清除浏览器默认样式(代替 *{}) 将代码放入 css 文件,使用 link 引入. /* v2.0 | 20110126 http://meyerweb.com/eric/tools/css/ ...
- 浏览器默认样式及reset
写在前面 首先纠正一个易错概念.div并非生来就是块元素,而是每个浏览器都有一套默认的css样式(优先级最低),默认样式里会把div设置成display: block;还有margin,padding ...
- 浏览器默认样式(user agent stylesheet)+cssreset
每种浏览器都有一套默认的样式表,即user agent stylesheet,在写网页时,没有指定的样式,按浏览器内置的样式表来渲染.这是合理的,像word中也有一些预留样式,可以让我们的排版更美观整 ...
- 浏览器默认样式(User Agent Stylesheet)
原文:http://www.zjgsq.com/898.html 不同浏览器对于相同元素的默认样式并不一致,这也是为什么我们在CSS的最开始要写 * {padding:0;marging:0}: 不过 ...
- css 框架——base.css,作用是重设浏览器默认样式和提供通用原子类。自己留存
今天发下我自己的 css 框架——base.css,作用是重设浏览器默认样式和提供通用原子类. @charset "utf-8"; /*! * @名称:base.css * @功能 ...
- __x__(23)0907第四天__浏览器默认样式
浏览器默认样式: 为了美观,浏览器为了在页面没有样式时,也可以有一个较好的显示效果,默认设置若干 margin,padding. 作为开发人员,在CSS编写最初,一般都会清除默认样式, ...
- CSS系列——浏览器默认样式
了解HTML标签在各浏览器当中的默认样式,可以让我们了解,为什么会要写Reset.css,Reset.css当中要怎么写样式最合理.试着思考下面的问题: 为什么会有默认样式? 每个浏览器的默认样式有什 ...
- css知多少(4)——解读浏览器默认样式
上一节<css知多少(3)——样式来源与层叠规则>介绍了样式的五种来源,咱们再通过一张图回顾一下. 对于上面的三层,咱们大概都比较熟悉了.下面的两层中,用户自定义样式一般也就是改一改字号大 ...
随机推荐
- JS0基础学习笔记(1)
为了须要,最近開始学习JS相关知识.基本的方式是通过看视频以及查阅相关手冊.并动手实践,亲手写出每一个小案例,以下是相关代码(每一个案例用分隔线隔开). <!DOCTYPE html> & ...
- Centos7安装Rancher
docker pull rancher/server:v1.6.14 启动一个单实例的Rancher. docker run -d --restart=unless-stopped -p 8080:8 ...
- Codeforces Round #277 (Div. 2)A. Calculating Function 水
A. Calculating Function For a positive integer n let's define a function f: f(n) = - 1 + 2 - 3 + ...
- 阿里云 Docker-registry 搭建
阿里云 仓库地址: https://cr.console.aliyun.com/cn-hangzhou/instances/images
- How to do IF NOT EXISTS in SQLite
http://stackoverflow.com/questions/531035/how-to-do-if-not-exists-in-sqlite How about this? INSERT O ...
- poj--1753--Flip Game(dfs好题)
Flip Game Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 37201 Accepted: 16201 Descr ...
- PCB Genesis原点坐标转换关系
一.Genesis原点坐标转换关系: 1.读取Genesis坐标转换: UI界面坐标 = 文件坐标 - 偏移值 2.写入Genesis坐标转换: 文件坐标 = UI界面坐标 + 偏移值 3.为 ...
- [Apple开发者帐户帮助]五、管理标识符(2)启用应用服务
您可以在证书,标识符和配置文件中查看和启用App ID的服务.包含已修改的App ID的供应配置文件将变为无效.您需要重新生成使用该App ID的配置文件. 注意:要为应用程序完全配置服务,请在Xco ...
- JS代码放在哪里比较好!
在页面上加上<script></script>只有2个地方:head中,body体中 如果外部的JS文件,在head中加,写页面特效js放在body后面. <html&g ...
- Microsoft SQL Server 2005技术内幕:T-SQL查询笔记
logical operation:基于微软查询处理概念模型的逻辑操作.例如,联接运算符的physical operation属性表示联接算法(nested loops,merge ,hash)物理运 ...