不同行高属性值不同的继承表现实例页面

展示

代码

• HTML：

  <div class="box box-1">
      <h3>标题</h3>
      <p>内容</p>
  </div>
  <div class="box box-2">
      <h3>标题</h3>
      <p>内容</p>
  </div>
  <div class="box box-3">
      <h3>标题</h3>
      <p>内容</p>
  </div>

• CSS：

  .box   { font-size: 14px; }
  .box-1 { line-height: 1.5; }
  .box-2 { line-height: 150%; }
  .box-3 { line-height: 1.5em; }
  
  h3, p {
      margin: 0;
  }
  h3 { font-size: 32px; }
  p  { font-size: 20px; }