博客首页CSS2-3分类
Yahoo YUI Reset
发布时间:2016-06-29 11:57:41编辑:Mr.Co阅读(3444)
现在市面上的各个终端中都会有不同的Browser,这些Browser都会有自己的默认自带的Element样式,辣么为了统一我们的样式在各个Browser中显示的方式一致。那我们就必须预先Reset所有的Element。这里我推荐YUI的Reset。
相信大家最常用的reset的方法莫过于下面这种方式,简单粗暴。
*{ padding:0; margin:0; border:0; }但是上面这种方式太过于简单,很多element的潜在样式并没有reset到。
我们还是看看YUI的Reset源码:
html{ color:#000; background:#FFF; } /* TODO remove settings on BODY since we can't namespace it. */ /* TODO test putting a class on HEAD. - Fails on FF. */ 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; } /* TODO think about hanlding inheritence differently, maybe letting IE6 fail a bit... */ 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; font-variant:normal; } /* to preserve line-height and selector appearance */ sup { vertical-align:text-top; } sub { vertical-align:text-bottom; } input, textarea, select { font-family:inherit; font-size:inherit; font-weight:inherit; *font-size:100%; /*to enable resizing for IE*/ } /*because legend doesn't inherit in IE */ legend { color:#000; } /* YUI CSS Detection Stamp */ #yui3-css-stamp.cssreset { display: none; }
YUI提供了CDN地址,将它放置到你的所有样式之上, 强烈建议放置在head中:
<link rel="stylesheet" href="http://yui.yahooapis.com/3.18.1/build/cssreset/cssreset-min.css">
转载请注明出自:http://www.mrco.cn/article/577347356248a4cd5b5deff9.html