资讯专栏INFORMATION COLUMN

一些大厂的css reset 代码

yzzz / 3021人阅读

摘要:不同的浏览器对标签的默认值不同,为了避免页面出现浏览器差异,所以要初始化样式表属性。使用通配符并不可取,因为会遍历到每一个标签,大型网页会加载过慢,影响性能。

不同的浏览器对标签的默认值不同,为了避免页面出现浏览器差异,所以要初始化样式表属性。使用通配符*并不可取,因为会遍历到每一个标签,大型网页会加载过慢,影响性能。

雅虎工程师提供的CSS初始化示例代码:

</>复制代码

  1. 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; }
  2. body { background:#fff; color:#555; font-size:14px; font-family: Verdana, Arial, Helvetica, sans-serif; }
  3. td,th,caption { font-size:14px; }
  4. h1, h2, h3, h4, h5, h6 { font-weight:normal; font-size:100%; }
  5. address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal;}
  6. a { color:#555; text-decoration:none; }
  7. a:hover { text-decoration:underline; }
  8. img { border:none; }
  9. ol,ul,li { list-style:none; }
  10. input, textarea, select, button { font:14px Verdana,Helvetica,Arial,sans-serif; }
  11. table { border-collapse:collapse; }
  12. html {overflow-y: scroll;}
  13. .clearfix:after {content: "."; display: block; height:0; clear:both; visibility: hidden;}
  14. .clearfix { *zoom:1; }

腾讯官网 样式初始化

</>复制代码

  1. body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0}
  2. body{font:12px"宋体","Arial Narrow",HELVETICA;background:#fff;-webkit-text-size-adjust:100%;}
  3. a{color:#2d374b;text-decoration:none}
  4. a:hover{color:#cd0200;text-decoration:underline}
  5. em{font-style:normal}
  6. li{list-style:none}
  7. img{border:0;vertical-align:middle}
  8. table{border-collapse:collapse;border-spacing:0}
  9. p{word-wrap:break-word}

新浪官网 样式初始化

</>复制代码

  1. body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{margin:0;padding:0;border:0;}
  2. body{background:#fff;color:#333;font-size:12px; margin-top:5px;font-family:"SimSun","宋体","Arial Narrow";}
  3. ul,ol{list-style-type:none;}
  4. select,input,img,select{vertical-align:middle;}
  5. a{text-decoration:none;}
  6. a:link{color:#009;}
  7. a:visited{color:#800080;}
  8. a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}

淘宝官网 样式初始化

</>复制代码

  1. body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }
  2. body, button, input, select, textarea { font:12px/1.5tahoma, arial, 5b8b4f53; }
  3. h1, h2, h3, h4, h5, h6{ font-size:100%; }
  4. address, cite, dfn, em, var { font-style:normal; }
  5. code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
  6. small{ font-size:12px; }
  7. ul, ol { list-style:none; }
  8. a { text-decoration:none; }
  9. a:hover { text-decoration:underline; }
  10. sup { vertical-align:text-top; }
  11. sub{ vertical-align:text-bottom; }
  12. legend { color:#000; }
  13. fieldset, img { border:0; }
  14. button, input, select, textarea { font-size:100%; }
  15. table { border-collapse:collapse; border-spacing:0; }

网易官网 样式初始化

</>复制代码

  1. html {overflow-y:scroll;}
  2. body {margin:0; padding:29px00; font:12px"5B8B4F53",sans-serif;background:#ffffff;}
  3. div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,p{padding:0; margin:0;}
  4. table,td,tr,th{font-size:12px;}
  5. li{list-style-type:none;}
  6. img{vertical-align:top;border:0;}
  7. ol,ul {list-style:none;}
  8. h1,h2,h3,h4,h5,h6{font-size:12px; font-weight:normal;}
  9. address,cite,code,em,th {font-weight:normal; font-style:normal;}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/52914.html

相关文章

  • 一些大厂css reset 代码

    摘要:不同的浏览器对标签的默认值不同,为了避免页面出现浏览器差异,所以要初始化样式表属性。使用通配符并不可取,因为会遍历到每一个标签,大型网页会加载过慢,影响性能。 不同的浏览器对标签的默认值不同,为了避免页面出现浏览器差异,所以要初始化样式表属性。使用通配符*并不可取,因为会遍历到每一个标签,大型网页会加载过慢,影响性能。 雅虎工程师提供的CSS初始化示例代码: body,div,dl,d...

    Cobub 评论0 收藏0
  • 关于CSS Reset 那些事(一)之 历史演变与Normalize.css

    摘要:下面开始对进行简单的介绍,关于两者的差异区别可以看问答平台使用遇到的问题和有什么本质区别没简单介绍关于对的介绍,这里引用咀嚼之味针对官方介绍翻译的的中文版本。目前已经成为了的替代方案是无可争议的事情了。 前言 近期在翻阅陈旧的历史资料,整理之前饱受争议的CSS Reset问题,不过好像十多年过去,现在大家统一了口径,纷纷推荐使用Normalize.css,包括Bootstrap都进行...

    idealcn 评论0 收藏0
  • 关于CSS Reset 那些事(一)之 历史演变与Normalize.css

    摘要:下面开始对进行简单的介绍,关于两者的差异区别可以看问答平台使用遇到的问题和有什么本质区别没简单介绍关于对的介绍,这里引用咀嚼之味针对官方介绍翻译的的中文版本。目前已经成为了的替代方案是无可争议的事情了。 前言 近期在翻阅陈旧的历史资料,整理之前饱受争议的CSS Reset问题,不过好像十多年过去,现在大家统一了口径,纷纷推荐使用Normalize.css,包括Bootstrap都进行...

    calx 评论0 收藏0
  • 大厂前端面试考什么?

    摘要:面试流程如果你时间紧张或是在职,大部分大公司是支持第一轮电话面试的,而腾讯,阿里的面试基本前两轮都是电话面。组员面总体来说考察的东西较基础。也有会问你设计模式,各种继承方法的对于大厂的面试来说,重要性可能比还要高。 背景 我最近一个月面试了20来个公司,其中有你们应该都听过的bat,今日头条,京东,网易,大疆,oppo,还有shopee,招商金科,有赞等比较不错的公司,收获了六个off...

    jubincn 评论0 收藏0

发表评论

0条评论

yzzz

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<