CSS 重置和字体系列

Question

html, body, h1, h2, h3, h4, p, div, ul, ol, li {
padding: 0;
border: 0;
margin: 0;
font: inherit;
font-size: 100%;
font-family: "Helvetica Neue", Helvetica, sans-serif; 
}

有人知道为什么 "font-family" 属性如果我将它移到 "font:inherit" 以上就不起作用吗？

Answer 1

因为 font 是一个包含 font-family.

的 shorthand

如果在同一个rule-set中两次设置相同的属性，则最后一个获胜。

举例说明：

div {
  display: inline-block;
  height: 20px;
  width: 20px;
  padding: 5px;
  margin: 5px
}
.A {
  border: solid red 1px;
  border-left: dotted blue 2px;
}
.B {
  border-left: dotted blue 2px;
  border: solid red 1px;
}

<div class="A"></div>
<div class="B"></div>

CSS 重置和字体系列

CSS Reset and Font-family

css

inheritance

reset

font-family