从计算值出现的地方来看，它是来自浏览器默认的CSS吗？

Question

计算值来自何处，是否来自浏览器默认的css？

计算值和浏览器默认样式是否相同？

alt text http://shup.com/Shup/360142/11058112245-My-Desktop.png

Answer 1

不，他们不是一回事。计算值是元素的当前样式。如果没有设置其他值，这些计算值将包含默认值，如果设置了一个或多个值，则包含支配值。

计算值恰好是浏览器计算出影响这些值的所有因素之后的值。

您可以使用element.currentStyle (IE)和window.getComputedStyle(element); (W3C)

从脚本中获取计算值

// Note that Firefox requires the second argument is passed even when null. 
var cStyle = element.currentStyle || window.getComputedStyle(element, null); 

Answer 2

浏览器样式是浏览器作为默认样式的样式表，例如为链接添加下划线，使标题更大，粗体更强等等。（有些开发人员不喜欢浏览器样式之间的不一致，因此他们应用重置，例如：YUI Reset）

当您访问具有自己的样式表的网站时，这些样式会在浏览器添加后添加到网站元素上。

EG。浏览器的默认样式表示所有a元素都应该有下划线并且为蓝色。您访问了一个使用css重置的网站，例如，所有a个元素都应该是蓝色而没有下划线。此时a元素的计算样式为蓝色，没有下划线（因为后面应用的重置会覆盖浏览器样式）。然后加载网站的主样式表，这使得它很漂亮，它说除了很多其他东西之外，所有a元素都应该有文本阴影。计算出的样式现在为蓝色，没有下划线和文本阴影。

计算样式部分中有这么多其他属性的原因是因为浏览器添加了许多默认样式。

作为旁注，使用css selector priorities会更加复杂。

Answer 3

它来自浏览器的CSS引擎。是的，它来自浏览器。

Answer 4

计算出的样式是在排序完所有样式规则后应用于元素的实际样式。

样式规则可能来自：

• 浏览器默认样式
• 浏览器中可选的用户定义样式
• 页面中的样式表
• 元素中的样式属性

将考虑适用于该元素的所有样式规则，并且每个属性最具体且最后指定的样式规则是适用的样式规则。