字体系列标签

代码和运行结果就放到后面去了，我们平时很少改文字为斜体，都是把它改成不倾斜的

em和i两个标签都是表示倾斜的，但它们两个也是有区别的

font复合属性可以把多个font属性的标签合为一体，这样写更节约代码，但在写的过程中，必须按照它的语法格式来写，不能更换顺序
下面是font属性的总结

 

 

 

 下面就是整个代码
<!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>Document</title>
    <style>
        p {
            color: palevioletred;
            font-weight: bold;
            /* bold是加粗，normal是正常 */
        }

 

        div {
            color: pink;
            font-weight: normal;
        }

 

        span {
            color: red;
            font-weight: 400;
            /* 可以使用纯数字来表示，取值范围在100-900的整百数，常用的是400和700
            字体大小默认为400就是正常的大小，加粗是700
            注：不是所有字体都提供了九种粗细，所以部分取值在网页中是没有变化的*/
        }

 

        #color {
            color: red;
            font-weight: 700;
        }

 

        #style1 {
            font-style: italic;
            /* 上述字体样式是倾斜的，还有一种是normal，和前面的一样的是正常的，写或不写都没啥差别 */
        }

 

        em {
            /* font-style: normal; */
        }

 

        i {
            font-style: normal;
        }

 

        #comprehensive

 

        /*font的复合属性*/
            {
            /* 现在要使指定的div中的字体样式改为倾斜，加粗，30px，微软雅黑 */
            /* font: font-style font-weight font-size/line-height font-family;
            必须要按照上面的顺序来写，不能更换顺序，各个属性之间用空格隔开 */
            font: italic bold 30px '微软雅黑';
        }
    </style>
</head>

 

<body>
    <p>木更老婆</p>
    <div>神子老婆</div>
    <span>胡桃老婆</span>
    <span id="color">胡桃老婆</span><br>
    以下为小黑子交流区
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <div id="style1">歪歪扭扭的</div>
    <em>你干嘛~哎呦</em><br>
    <i>鸡你太美</i><br>
    <div id="comprehensive">你们越黑,我家哥哥就越火,他越火烤的就越香,等它出炉时你们别流口水</div>
</body>

 

</html>
 这是网页的展示效果
posted @ 2023-01-09 17:48  梗  阅读(86)  评论(0)    收藏  举报