为什么标准的"样板"模板在CSS3中包含如此多的声明？

Question

这个问题面向CSS3,我一直在寻找一些样板模板和指南,其中大部分都会在进入你想要编辑的内容之前声明很多属性.

• 为什么会这样？声明所有可用属性是否会使浏览器加载速度更快？

• 有什么好处？为什么不直接使用CSS3(就像声明HTML部分中使用的那样)？

• 如果底层属性在更多版本中发生变化,那么这是不是意味着您必须不断检查已弃用的属性并且每隔一段时间继续声明和更改属性？

Answer 1

HTML5Boilerplate包含normalize.css的一个版本.它不是将所有内容重置为0(即边距,填充等),而是具有最小的更改集,以确保所有浏览器中的内容都具有相同的设置.用他们自己的话说:

"Normalize.css是一个可自定义的CSS文件,它使浏览器更加一致地呈现所有元素并符合现代标准.我们研究了默认浏览器样式之间的差异,以便只精确定位需要规范化的样式."

这里使用的样式的一个例子是:

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

这修复了旧版IE以及iOS上的一些奇怪现象.这是你可能遇到的问题,读取负载,找到解决方案并最终自己添加.通过使用这组默认值,您可以避免很多奇怪.

除了错误,它还包括您可能想要的东西:

nav ul,
nav ol {
    list-style: none;
    list-style-image: none;
    margin: 0;
    padding: 0;
}

在导航中使用ul是一种常见模式,您通常不希望在那里使用项目符号.这为你排序.

总而言之,我建议使用您自己的代码自定义版本 - 它会为您节省很多烦恼!