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)——样式来源与层叠规则>介绍了样式的五种来源,咱们再通过一张图回顾一下. 对于上面的三层,咱们大概都比较熟悉了.下面的两层中,用户自定义样式一般也就是改一改字号大 ...
随机推荐
- 《Pro Android Graphics》读书笔记之第二节
Android Digital Video: Formats, Concepts and Optimization Android Digital Video Formats: MPEG4 H.264 ...
- .m文件导入C++头文件带来的错误
这几天的工作挖了不少的坑.遇到了各种千奇百怪的错误,如今好好总结一下. 新建一个project,然后新建HelloCPP.h,HelloCPP.cpp文件.HelloCPP.h文件内容例如以下: #i ...
- 使用printf函数实现串口信息打印——设置IAR和Keil的Options
在Keil和IAR中都可以使用printf函数,但两者设置的方法不一样.以下分别是IAR和Keil的设置. 下面是Keil的设置. 选中Options--->Target--->Code ...
- Android+Jquery Mobile学习系列(5)-SQLite数据库
SQLite是轻量级的.嵌入式的.关系型数据库,目前已经在iPhone.Android等手机系统中使用,SQLite可移植性好,很容易使用,很小,高效而且可靠. 因为Android已经集成了SQLit ...
- poj--3061--Subsequence(贪心)
Subsequence Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 10882 Accepted: 4498 Desc ...
- 95.Extjs 表单中自定义的验证规则 VTypes
1 Ext.onReady(function(){ Ext.QuickTips.init(); //重写 (自定义)xtype Ext.apply(Ext.form.VTypes,{ repetiti ...
- C++ this指针 全部
在每一个成员函数中都包含一个特殊的指针,这个指针的名字是固定的.叫做this.它是指向本类对象的指针,它的值是当前被调用的成员函数所在的对象的起 始地址.例如:当调用成员函数a.volume ...
- centOS 7.4 安装配置jdk1.8
按以下步骤安装 JDK. 1.新建一个目录: mkdir /usr/java 2.通过XShell 上传本地安装包或者通过命令下载在线安装包 wget http://mirrors.linuxeye. ...
- java joor 实现反射简单调用
有时候需要用反射实现代码.直接用工具,joor 上代码: package com.ming.joor; import static org.joor.Reflect.*; public class T ...
- Nginx作为负载均衡服务
负载均衡服务器配置: 注意:upstream和server同级 案例: 建立两个基于端口的虚拟主机来模拟两台web服务器. (1)新建一个www.123.com:81和www.123.com:82的虚 ...