瀏覽器預設文字大小

weixin_34146805發表於2016-08-29
瀏覽器

1）瀏覽器預設文字大小為16px
3）預設行高line-height：18px
2）行高=文字大小+上間距+下間距
4）行高也等於兩條基線之間的距離

2346639-d5b7388c2f2b1d10.png
Paste_Image.png

5）行高等於父容器的高就會讓文字居中顯示，因為要換算一下上下間距。
行高單位：

2346639-4ca82037750039ec.png
Paste_Image.png
        div{

        height: 100px;
        width: 100px;
        background-color: pink;
        font-size: 10px;
        line-height: 100px;
    }

6）繼承關係

 <head>

    <meta charset="utf-8">
    <style type="text/css">
    .one{
        font-size: 20px;
        line-height: 2;
    }
    .two{
        font-size: 30px;
    }
    </style>
</head>
<body>
<div class="one">
    <div class="two">
    文字
    </div>
</div>
</body>
2346639-ea28a3b8a4882dab.png
Paste_Image.png

相關文章