200字范文,内容丰富有趣,生活中的好帮手!
200字范文 > CSS重置样式表

CSS重置样式表

时间:2022-01-28 05:14:27

相关推荐

CSS重置样式表

网页设计,让人最头疼的莫过于让页面兼容各大浏览器,准确些是兼容它们“默认”的CSS样式表。

第一种方式

1 * {margin:0px; padding:0px;}

这行代码虽然简单,但却让网页解析太慢。

于是出现了几种CSS重置方法:

第二种方式

NETTUTS上的 Jeffrey Way写了篇文章Weekend Quick Tip: Create Your Own Simple Reset.css File

释出自己用来重置CSS样式表的方法

1 body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol, 2 li, dl, dt, dd, form, a, fieldset, input, th, td 3 {margin: 0; padding: 0; border: 0; outline: none;} 4 body{line-height: 1;font-size: 88% /* Decide for yourself if you want to include this. */;} 5 h1, h2, h3, h4, h5, h6{font-size: 100%;padding: .6em 0;margin: 0 15px;} 6 ul, ol{list-style: none;} 7 a{color: black;text-decoration: none;} 8 a:hover 9 {text-decoration: underline;}10 .floatLeft{float: left;padding: .5em .5em .5em 0;}11 .floatRight{float: right;padding: .5em 0 .5em .5em;}12

这个方法适用于大多数的网页设计。

第三种方式

这个重置的太多

1 html, body, div, span, applet, object, iframe, 2 h1, h2, h3, h4, h5, h6, p, blockquote, pre, 3 a, abbr, acronym, address, big, cite, code, 4 del, dfn, em, font, img, ins, kbd, q, s, samp, 5 small, strike, strong, sub, sup, tt, var, 6 b, u, i, center, 7 dl, dt, dd, ol, ul, li, 8 fieldset, form, label, legend, 9 table, caption, tbody, tfoot, thead, tr, th, td {10 margin: 0;11 padding: 0;12 border: 0;13 outline: 0;14 font-size: 100%;15 vertical-align: baseline;16 background: transparent;17 }18 body {line-height: 1;}19 ol, ul {list-style: none;}20 blockquote, q {quotes: none;}21 blockquote:before, blockquote:after,22 q:before, q:after {content: '';content: none;}23 24 /* remember to define focus styles! */25 :focus {outline: 0;}26 27 /* remember to highlight inserts somehow! */28 ins {text-decoration: none;}29 del {text-decoration: line-through;}30 31 /* tables still need 'cellspacing="0"' in the markup */32 table {border-collapse: collapse;border-spacing: 0;}

第四种方式

还有今天sofish提到的Yahoo的YUI提供的CSS重置文件

1 body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 2 margin:0; 3 padding:0; 4 } 5 table {border-collapse:collapse;border-spacing:0;} 6 fieldset,img {border:0;} 7 address,caption,cite,code,dfn,em,strong,th,var {font-style:normal; 8 font-weight:normal;} 9 ol,ul {list-style:none;}10 caption,th {text-align:left;}11 h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}12 q:before,q:after {content:'';}13 abbr,acronym {border:0;}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。