• 其他

    其他

    • 如果需要 CSS Hacks，需详细注明解决什么问题。
    • 尽量避免使用 IE 中的 CSS filters。
    • font-weight普通字重使用normal，加粗使用bold。大部分字体只有两个字重，所以
      不建议使用容易混淆的数值表示方法。
    • 如无特别精确的要求，推荐使用不带单位的line-height，这样当前元素的行高只与自身font-size成比例关系，使排版更加灵活。例如line-height:1.5
      line-height: 1.5 ≠ line-height: 150% 
    1. <div class="box">
    2.   <p>line-height</p>
    3. </div>
    1. .box {
    2.   line-height: 50px;
    3.   font-size: 20px;  
    4. }
    5. /**
    6.  * 这里 p 的行高直接继承父元素的行高，最终
    7.    p { line-height: 50px; }
    8.  */
    9. p {
    10.   font-size: 40px;
    11. }
    1. .box {
    2.   line-height: 150%;
    3.   font-size: 20px;  
    4. }
    5. /**
    6.  * p 的行高计算过程为：
    7.  * 1. 先计算出父元素的行高（150% * 20px = 30px）
    8.  * 2. 然后 p 继承父元素的行高，最终
    9.    p { line-height: 30px; }
    10.  */
    11. p {
    12.   font-size: 40px;
    13. }
    1. .box {
    2.   line-height: 1.5;
    3.   font-size: 20px;  
    4. }
    5. /**
    6.  * p 的行高计算过程为：
    7.  * 1. 先继承父元素的 1.5（1.5 * 40px = 60px）
    8.  * 2. 然后乘以 p 的 font-size，最终
    9.    p { line-height: 60px; }
    10.  */
    11. p {
    12.   font-size: 40px;
    13. }