web前端——css样式的复合写法

就是将好多的样式写在一行里,从而减少代码量。

如字体的一些样式,我们可以将文字大小、颜色、加粗等都写在一行里面。

具体的样式属性:

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>标签</title>
    <style type="text/css">
        div{
            font-size: 20px;
            font-family: "黑体";
            font-weight: bold;
            color:red;
            font-style: italic;
        }
    </style>
</head>
    <body>
        <div>卡特琳娜</div>
    </body>
</html>

连写后的样子:

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>标签</title>
    <style type="text/css">
        div{
            color:red;
            font: italic bold 20px "黑体";
        }
    </style>
</head>
    <body>
        <div>卡特琳娜</div>
    </body>
</html>

font属性的连写是有顺序的,格式是:      font  :    font-style  font-weigth font-size font-family;

写错位置就有可能显示不出来了,如果不需要哪个样式也可以不写,比如字体大小不需要变,那我们就写三个就可以了。

猜你喜欢

转载自blog.csdn.net/xishaoguo/article/details/79480987