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

最新推荐文章于 2022-11-23 16:34:36 发布

二小1号

最新推荐文章于 2022-11-23 16:34:36 发布

阅读量3k

点赞数

分类专栏： web前端学习文章标签： css样式连写

本文链接：https://blog.csdn.net/xishaoguo/article/details/79480987

版权

web前端学习专栏收录该内容

43 篇文章 4 订阅

订阅专栏

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

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

具体的样式属性：

<!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;

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

二小1号

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
web前端——css样式的复合写法

就是将好多的样式写在一行里，从而减少代码量。如字体的一些样式，我们可以将文字大小、颜色、加粗等都写在一行里面。具体的样式属性：&lt;!DOCTYPE html&gt;&lt;html lang="zh-CN"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;标签&lt;/title&g
复制链接

扫一扫

专栏目录