边框属性

最新推荐文章于 2021-12-14 10:43:13 发布

jwz934738949

最新推荐文章于 2021-12-14 10:43:13 发布

阅读量504

点赞数

分类专栏： HTML与CSS

本文链接：https://blog.csdn.net/jwz934738949/article/details/89209721

版权

HTML与CSS 专栏收录该内容

73 篇文章 1 订阅

订阅专栏

格式：

border:边框宽度边框样式边框颜色

分别设置四条边表框：

border-top:边框宽度边框样式边框颜色

border-right:边框宽度边框样式边框颜色

border-bottom:边框宽度边框样式边框颜色

border-left:边框宽度边框样式边框颜色

注意点：

在border中，宽度与颜色可以省略，颜色默认为黑色；但是样式不可以省略，省略后看不到边框。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>标题</title>
    <style>
        div {
            height: 500px;
            width: 500px;
            border-top: 10px dotted blue;
            border-right: 10px solid yellow;
            border-bottom: 10px double red;
            border-left: 10px dashed black;
        }
    </style>
</head>
<body>
<div>
</div>
</body>
</html>

设置四条边的宽度： border-width:上右下左

设置四条边的样式：border-style:上右下左

设置四条边的颜色：border-color:上右下左

当省略某条边时，这条边的属性与对面的那条边相同。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>标题</title>
    <style>
        div {
            height: 500px;
            width: 500px;
            border-width: 10px;
            border-style: dotted solid double dashed;
            border-color: blue yellow red black;
        }
    </style>
</head>
<body>
<div>
</div>
</body>
</html>

jwz934738949

关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
边框属性

格式：border:边框宽度边框样式边框颜色分别设置四条边表框：border-top:边框宽度边框样式边框颜色border-right:边框宽度边框样式边框颜色border-bottom:边框宽度边框样式边框颜色border-left:边框宽度边框样式边框颜色注意点：在border中，宽度与颜色可以省略，颜色默认为黑色；但是样式不可以省略，省略后...
复制链接

扫一扫