CSS重置 - 它到底是做什么的？

时间：2012-07-20 11:53:20

标签： css

我在jquery图像滑块演示中找到了这个reset.css文件，但它从未包含在主index.html文件中。什么是假设，更重要的是，你把它放在哪里？你把之前的放在任何引用的样式表（）吗？

这是reset.css里面的代码

/* CSS reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
    margin:0;
    padding:0;
}
html,body {
    margin:0;
    padding:0;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
fieldset,img { 
    border:0;
}
input{
    border:1px solid #b0b0b0;
    padding:3px 5px 4px;
    color:#979797;
    width:190px;
}
address,caption,cite,code,dfn,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;
}

8 个答案:

答案 0 :(得分：81)

一开始，没有关于样式如何工作的标准化，每个浏览器实现了它认为正确的。您在IE中看到如此多关于样式错误的问题的原因之一是因为IE在样式方面与其他浏览器的差异最大。虽然IE已经有所改进，但其他浏览器也有所改进 自己的边框，填充和边距，缩放，字体到元素，给予自己独特的页面感觉。一个例子是，chrome为文本框提供了自己的黄色边框。 “重置”实际上将所有这些样式“重置”为零/无，这样您就不会在页面中看到任何未应用的样式。

如果这些样式没有“重置”，您将看到不需要的样式/效果和破坏的东西。它总是建议“重置”浏览器的样式。

查看这篇文章Should you Reset Your CSS?

答案 1 :(得分：36)

reset.css用于规范化浏览器的默认样式。

示例：

enter image description here

答案 2 :(得分：16)

看看这里的答案，“重置”和“正常化”之间似乎有点混淆。他们的目标略有不同。

CSS重置是您在其他样式之前加载的一组样式，用于删除浏览器内置样式。其中最受欢迎的是Eric Mayer的Reset CSS。

另一种选择是协调浏览器内置样式。目前最流行的工具是Normalize.css。

答案 3 :(得分：5)

浏览器具有不同的“内置”样式，它们适用于不同的html元素。这些样式定义可能因不同浏览器而异。规范化的css文件旨在通过重置这些特定于浏览器的styes来“规范化”跨浏览器的页面呈现。

您必须在之前包含它自己的样式定义。否则这些样式可能会覆盖（由于css的级联性质）你的声明，这没有多大意义;）

最受欢迎的样式重置可能是Eric Meyer's，附带一些背景信息..

答案 4 :(得分：3)

浏览器可以根据其原生渲染引擎呈现HTML和CSS。不同的浏览器可能会使用不同的渲染方法[IE;]如果你知道我的意思] 所以reset.css的内涵是将所有属性设置为常见的预定义值，这样开发人员/设计人员就可以忘记一些渲染引擎，从头开始开发。

答案 5 :(得分：3)

每个浏览器都有自己的默认user agent样式表，用于使无样式的网站看起来更清晰。例如，默认情况下，大多数浏览器会将链接设置为蓝色，访问链接为紫色，为表格提供一定数量的边框和填充，将变量font-size应用于H1，H2，{{1}几乎所有东西都有一定量的填充。

有没有想过为什么每个浏览器中的提交按钮看起来都不同？

显然，这给CSS作者带来了一定的麻烦，他们无法弄清楚如何让他们的网站在每个浏览器中看起来都一样。

使用CSS重置，CSS作者可以强制每个浏览器将其所有样式重置为null，从而尽可能避免跨浏览器的差异。

根据您通过重置设置的一致基础，您可以继续重新设置文档样式，安全地知道浏览器在HTML默认呈现方面的差异无法触及您！

希望它有所帮助，您可能需要查看这篇文章Which CSS Reset Should I Use?。

答案 6 :(得分：3)

  

CSS重置（或“重置CSS”）是一个短暂的，经常被压缩（缩小）   一组CSS规则，用于将所有HTML元素的样式重置为a   一致的基线。

     

如果您不知道，每个浏览器都有自己的默认用户   代理'样式表，用于使无格式网站显得更多   清晰可辨。例如，大多数浏览器默认情况下将链接设为蓝色和   访问链接紫色，给表格一定数量的边框和   填充，将可变字体大小应用于H1，H2，H3等等   几乎所有东西的填充量。曾经想知道为什么提交   每个浏览器中的按钮看起来都不同？

     

显然这会给CSS作者带来一定的麻烦，   谁也无法弄清楚如何使他们的网站在每一个看起来都一样   浏览器。

     

使用CSS重置，CSS作者可以强制每个浏览器都拥有它   样式重置为null，从而避免了跨浏览器的差异   

参考http://www.cssreset.com/what-is-a-css-reset/

答案 7 :(得分：0)

简单来说，由于浏览器不一致，需要重置CSS。详细来说，所有浏览器的渲染都不相同。因此，Web渲染因浏览器而异。

如果您要使用/重置，Meyer Web将提供最大的CSS重置代码。您可以找到它here。如果您需要更多详细信息，here也可以找出CSS重置的更多详细信息以及我们为什么需要使用它。

相关问题
最新问题