13-2·100 css三大特性

 

   

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>demo 模板</title>
    <style>
        /* 这里，这个body是父元素 */
        body {
            color: aqua;
            /* font: 12px/24px 'Microsoft YaHei'; */
            font: 12px/1.5 'Microsoft YaHei';
        }

        /* div 为子元素，其实所有body里面的都是子元素了  */
        div {
            /* 子元素继承了父元素body的行高 1.5 */
            /* 这个1.5 就是当前元素文字大小 font-size 的1.5倍 */
            font-size: 14px;
        }

        P {
            /* 1.5*16 =当前的行高 */
            font-size: 16px;
        }

        /* li 没有手动指定文字大小  body 12px 所有li的文字大小为 12px 
          当前li的行高就是 12* 1.5 = 18px
         */
    </style>
</head>

<body>
    <h1>行高的继承</h1>

    <div>this is a div </div>
    <p>p段落</p>

    <ul>
        <li>我没有指定文字大小</li>
    </ul>


</body>

</html>

效果

    

 

posted @ 2022-02-10 17:30  优敏行  阅读(30)  评论(0)    收藏  举报