4.4 CSS简写边框属性

来源：网络作者：站长

在学习了前面的章节中，边框它有许多属性要写。为了缩减代码，我们可以在一个属性中指定所有单独的边框属性。

border 属性是以下各个边框属性的简写属性：

border-width
border-style（必需）
border-color

例如：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>4.4 CSS简写边框属性</title>
    </head>
    <style>
        p {
            border: 5px solid red;
        }
    </style>
    <body>
        <p>读一本好书，就如同和一个高尚的人在交谈。——歌德</p>
    </body>
</html>

运行后如图：

还可以只为一个边指定所有单个边框属性：

左边框：

p {
  border-left: 6px solid red;
  background-color: lightgrey;
}

知之者不如好之者，好之者不如乐之者。

下边框：

p {
  border-bottom: 6px solid red;
  background-color: lightgrey;
}

知之者不如好之者，好之者不如乐之者。

东方星雨

如果缘分安排我们相遇，请不要让他擦肩而过。扫一扫二维码，加我为好友吧！

上一篇：4.3 CSS边框颜色下一篇：4.5 CSS圆角边框

你觉得文章内容怎么样

站长推荐

网站分类

阿里云代金券￥100 云产品通用

有效期30天首购用户

立即领取

阿里云代金券￥100 云产品通用

有效期30天复购+升级

立即领取