Question

我面临一个奇怪的问题，即CSS覆盖'font-weight'属性。以下是显示问题的代码： -

元素'p'的'font-weight'设置为小（与颜色设置为紫色的方式相同）。但是FF / Chrome上的字体仍然以粗体显示，而颜色覆盖为紫色。

知道为什么会这样吗？

p {
  font-weight: small;
  color: purple;
}

#speciality_test {
  font-weight: bold;
  color: red;
}

.class_speciality_test {
  font-weight: bold;
  color: red;
}

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />

</head>

<body>
  <div id="speciality_test">
    <p>
      Inside identifier... HTML CSS test pages.
    </p>
  </div>
  <div class="class_speciality_test">
    <p>
      Inside class... HTML CSS test pages.
    </p>
  </div>
</body>

</html>

Answer 1

没有font-weight:small;。我认为您的意思是font-weight:normal;或font-size:small;。

另见CSS Fonts Module Level 3: 3.2 Font weight: the font-weight property。

Answer 2

font-weight不能是small。它可以是bold或normal。所以你的宣言被忽略了。

请在此处查看可能的值：http://www.w3schools.com/cssref/pr_font_weight.asp

Answer 3

small是否为有效值？根据W3C，它应该是normal，bold，bolder，lighter，inherit或数字之一。

Answer 4

我认为小有效。

font-weight: normal;

是我在工作中使用的

Answer 5

据我所知，small不是font-weight

的有效值

font-weight: { 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | bold | bolder | lighter | normal | inherit } ;

因此，在您的示例中，使用了#speciality_test的字体权重。

Sitepoint reference

CSS覆盖'font-weight'属性

5 个答案: