css初始化代码方案
(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-06-24)
为了消除各浏览器对css默认的设置,保持网页在各浏览器中的外观保持一致,初始化css就显得非常必要了!很多时候出现的样式不兼容问题,都可以通过css初始化代码来解决。下面列举常用的一些方案:
1.最耗资源的,最简单的
* { padding: 0; margin: 0; border: 0; }
2.选择性初始化举例(综合)
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,legend,button
form,fieldset,input,textarea,p,blockquote,th,td {
padding: 0;
margin: 0;
}
批注:上面的写法有问题,会导致浏览器解析异常。原因不明,推荐使用下面替代方案:
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: none;
outline: none;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
或者:
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
/* 酌情修改 */
body {
background:#fff;color:#333;font-size:12px;font-family:"SimSun","宋体","Arial Narrow";
}
/* 短引用的内容可取值:''或"" */
q:before,q:after {content:”;}
/* 缩写,图片等无边框 */
fieldset,img,abbr,acronym {border: 0 none;}
abbr,acronym {font-variant: normal;}
legend {color:#000;}
/* 清除特殊标记的字体和字号 */
address,caption,cite,code,dfn,em,strong,th,var {
font-weight: normal;
font-style: normal;
}
/* 上下标 */
sup {vertical-align: text-top;}
sub {vertical-align: text-bottom;}
/* 设置表格的边框被合并为一个单一的边框, 指定分隔边框模型中单元格边界之间的距离为0*/
table {
border-collapse: collapse;
border-spacing: 0;
}
/* 表格标题及内容居左显示 */
caption,th {text-align: left;}
input,img,select {vertical-align:middle;}
/* 清除列表样式 */
ol,ul {list-style: none;}
/* 输入控件字体 */
input,button,textarea,select,optgroup,option {
font-family:inherit;
font-size:inherit;
font-style:inherit;
font-weight:inherit;
}
/* 标题元素样式清除 */
h1,h2,h3,h4,h5,h6 {
font-weight: normal;
font-size: 100%;
}
/* 链接样式,颜色可酌情修改 */
del,ins,a {text-decoration:none;}
a:link {color:#009;}
a:visited {color:#800080;}
a:hover,a:active,a:focus {color:#c00; text-decoration:underline;}
/* 鼠标样式 */
input[type="submit"] {cursor: pointer;}
button {cursor: pointer;}
input::-moz-focus-inner { border: 0; padding: 0;}
3.sina的
/* 全局样式 */
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{
margin:0;padding:0;border:0;
}
body{
background:#fff;color:#333;font-size:12px; margin-top:5px;font-family:"SimSun","宋体","Arial Narrow";
}
ul,ol{
list-style-type:none;
}
select,input,img,select{
vertical-align:middle;
}
a{text-decoration:none;}a:link{color:#009;}a:visited{color:#800080;}a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
4.yahoo的
html {
background: none repeat scroll 0 0 #FFFFFF;
color: #000000;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
margin: 0;
padding: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset, img {
border: 0 none;
}
address, caption, cite, code, dfn, em, strong, th, var {
font-style: normal;
font-weight: normal;
}
li {
list-style: none outside 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 none;
font-variant: normal;
}
sup {
vertical-align: text-top;
}
sub {
vertical-align: text-bottom;
}
input, textarea, select {
font-family: inherit;
font-size: inherit;
font-weight: inherit;
}
input, textarea, select {
}
legend {
color: #000000;
}
body {
font: 13px/1.231 arial,helvetica,clean,sans-serif;
}
select, input, button, textarea {
font: 99% arial,helvetica,clean,sans-serif;
}
table {
font-size: inherit;
}
pre, code, kbd, samp, tt {
font-family: monospace;
line-height: 100%;
}
a {
text-decoration: none;
}
a:hover, a:focus {
text-decoration: underline;
}
strong {
font-weight: bold;
}
input[type="submit"] {
cursor: pointer;
}
button {
cursor: pointer;
}
5.博客园的
/*version: 2.7.0*
/html, body {
color: #000;
background: #FFF;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, 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, optgroup {
font-style: inherit;
font-weight: inherit;
}
del, ins { text-decoration: none; }
li { 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;
font-variant: normal;
}
sup { vertical-align: baseline; }
sub { vertical-align: baseline; }
legend { color: #000; }
input, button, textarea, select, optgroup, option {
font-family: inherit;
font-size: inherit;
font-style: inherit;
font-weight: inherit;
}
input, button, textarea, select { *font-size:100%;
}
.clear { clear: both; }
input::-moz-focus-inner {
border: 0;
padding: 0;
}/*added*/
input[type=button], input[type=submit] { -webkit-appearance: button; }
【个人收藏】
css初始化代码方案的更多相关文章
- css初始化代码
最近老有新项目开发,一直在找存留的CSS初始化代码,索性放到这里备份下, @charset "utf-8"; /* -------------------------------- ...
- 各大门户网站的css初始化代码
腾讯QQ官网 css样式初始 body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select ...
- CSS 初始化 代码
腾讯QQ官网 样式初始化 ;} body{font:12px"宋体","Arial Narrow",HELVETICA;background:#fff;-web ...
- 2016/3/1 淘宝 腾讯 网易 css初始化代码 以及最基础的初始化
淘宝官网(http://www.taobao.com/)样式初始化 body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, o ...
- 各大网站CSS初始化代码集合
css代码之所以初始化,是因为能尽量减少 各浏览器之间的兼容性问题! 腾讯QQ官网 样式初始化 body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fiel ...
- 各大网站css初始化代码【转】
文章来源:http://blog.sina.com.cn/s/blog_71ed1b870101a52w.html 腾讯QQ官网(http://www.qq.com)样式初始化 body,ol,ul, ...
- 雅虎工程师提供的CSS初始化代码
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,b ...
- 雅虎CSS初始化代码
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,b ...
- 淘宝的css初始化代码
;; } body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; } h1, h2, h3, h ...
随机推荐
- 三:分布式事务一致性协议2pc和3pc
一:分布式一致性协议--->对于一个分布式系统进行架构设计的过程中,往往会在系统的可用性和数据一致性之间进行反复的权衡,于是就产生了一系列的一致性协议.--->长期探索涌现出一大批经典的一 ...
- Oracle 11g RAC oc4j/gsd Offline
Oracle 11g RAC中,发现oc4j以及gsd服务都处于offline状态,这是Oracle 11g RAC默认情形.即便如此,并不影响数据库的使用,因为 oc4j 是用于WLM 的一个资源, ...
- IconRes提供免费高质量的Material风格android官方图标库
连接地址: http://www.iconres.com/android/index.php
- ubuntu 安装AMP环境的笔记 Prefork方式与fast-cgi方法
具体步骤如下: 系统:ubuntu 8.04 的发行版本 AMP with Prefork(mod-php5) 一.安装APACHE2 # sudo apt-get install ...
- myeclipse svn配置
在MyEclipse 9.0中安装SVN插件遇到一些问题,参考网上一些方法,最终解决.以下是个人认为比较简易的方法,供参考: 安装过程: (1)svn的插件版本site-1.8.14.zip(可根据自 ...
- C# "error CS1729: 'XXClass' does not contain a constructor that takes 0 arguments"的解决方案
出现这种错误的原因时,没有在子类的构造函数中指出仅有带参构造函数的父类的构造参数. 具体来讲就是: 当子类要重用父类的构造函数时, C# 语法通常会在子类构造函数后面调用 : base( para_t ...
- js闭包用法
闭包 既保证了 内部函数的私有性 又可以向外公开 通过一个已有对象 向它注入属性 /** * 闭包 * 在函数中定义的函数,在外部使用 * 1.在函数内部定义的函数,在外部不能访问 */ functi ...
- Oracle 取两个表中数据的交集并集差异集合
Oracle 取两个表中数据的交集 关键字: Oracle 取两个表中数据的交集 INTERSECT Oracle 作为一个大型的关系数据库,日常应用中往往需要提取两个表的交集数据 例如现有如下表,要 ...
- 解决ext时间插件在谷歌下变宽的BUG
在做一个项目时候遇到EXT这么一个问题,现分享出解决问题的代码 Ext.override(Ext.menu.DateMenu, { render: function () { Ext.menu.Dat ...
- 基于jquery的表格动态创建,自动绑定,自动获取值
最近刚加入GUT项目,学习了很多其他同事写的代码,感觉受益匪浅. 在GUT项目中,经常会碰到这样一个问题:动态生成表格,包括从数据库中读取数据,并绑定在表格中,以及从在页面上通过jQuery新增删除表 ...