css border 属性用于设置元素的边框。

通过css border 可以设置元素的边框样式(实线、虚线)、颜色和大小。

css border 有以下这些属性,它们分别是:

属性说明
border-color
设置边框颜色
border-width设置边框宽度
border-style设置边框样式,必须
border-radius设置边框圆角,css3

border 语法

以上是单独设置边框的样式,border也有他自己的语法,它是一个简写属性,语法如下:

border: border-width border-style border-color;

从上面的语法可以看出,我们可以一次性设置边框的颜色,样式,和大小,这也是我们在开发中经常用到的方法。

border 例子

<!DOCTYPE html>
<html>
	<title>css 边框 border</title>
<head>
<style>
p.one {
    border: 2px solid green;
}
p.two {
    border: 3px double red;
} 
p.three {
    border: 5px dotted blue;
} 
</style>
</head>
<body>
<p class="one">这是一个实心的红色边框</p>
<p class="two">这是双实线的红色边框</p>
<p class="three">这是虚线的蓝色边框</p>

</body>
</html>

效果如下所示:

css 边框属性 border