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 ...
随机推荐
- js sleep效果
js sleep效果 s = setInterval(function(){ //需要执行的函数 alert("我延迟了2秒弹出"); },2000); 并不是每2秒执行一次,而是 ...
- Oracle 单实例 迁移到 RAC 实例 -- 使用RMAN 异机恢复
Oracle 官网有关单实例迁移到RAC的一个步骤说明: How to Convert 10g Single-Instance database to 10g RAC using Manual Con ...
- 中小型数据库 RMAN CATALOG 备份恢复方案(一)
对于数据库的稳定性,高可用,跨平台以及海量数据库的处理,Oracle 数据库通常是大型数据库和大企业的首选.尽管如此,仍然不乏很多中小企业想要品尝一下Oracle腥味,因此在Oracle环境中也有不少 ...
- 安装sass时,gem在国内不能安装的解决
最近在安装SASS的时候,用到gem命令,但是运行出行如下错误!(先声明,安装sass前,要保证自己电脑安装了ruby:ruby -v可以测试下有没有装) 原因是ruby 的gem被和谐了,现在淘宝的 ...
- Nginx实现多个站点使用一个端口(配置Nginx的虚拟主机)
Nginx 是一个轻量级高性能的 Web 服务器, 并发处理能力强, 消耗资源小, 无论是静态服务器还是网站, Nginx 表现更加出色, 作为 Apache 的补充和替代使用率越来越高,目前很多大型 ...
- beginUpdates和endUpdates
我们在做UITableView的修改,删除,选择时,需要对UITableView进行一系列的动作操作. 这样,我们就会用到 [tableView beginUpdates]; if (newCount ...
- 嵌入式 uboot以及kernel添加看门狗临时记录(个人记录未整理乱)
Uboot_Kernerl_Add_Watch_Dog: U-Boot 2010.06 (Nov 01 2013 - 15:28:44) DRAM: 128 MiBCheck spi flash c ...
- [Everyday Mathematic]20150216
设 $A,B,C$ 是同阶方阵, 试证: $$\bex (A-B)C=BA^{-1}\ra C(A-B)=A^{-1}B. \eex$$
- js获取浏览器高度和宽度值,尽量的考虑了多浏览器。
js获取浏览器高度和宽度值,尽量的考虑了多浏览器. IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ...
- 句柄(handle)
< Back 句柄,在windows编程中用来标识: *.模块(module) *.任务(task) *.实例(instance) *.文件(file) *.内存块(block of memor ...