css 设置边框

在CSS中，可以使用border属性来设置元素的边框。border属性是一个简写属性，用于设置边框的宽度、样式和颜色，以下是一些常用的border属性值：

1、border-width: 设置边框的宽度，可以是像素值（如2px）或百分比值（如5%）。

2、border-style: 设置边框的样式，可以是以下值之一：none（无边框）、dotted（点状边框）、dashed（虚线边框）、solid（实线边框）、double（双线边框）、groove（3D凹槽边框）、ridge（3D凸槽边框）、inset（3D内嵌边框）或outset（3D外嵌边框）。

3、border-color: 设置边框的颜色，可以是颜色名称、十六进制颜色代码或RGBA值。

以下是一些使用border属性的示例：

/* 设置一个元素的所有边框 */
div {
  border: 2px solid red;
}
/* 分别设置元素的上、右、下、左边框 */
div {
  border-top: 2px dotted blue;
  border-right: 3px dashed green;
  border-bottom: 4px double purple;
  border-left: 5px groove orange;
}
/* 分别设置元素的上、右、下、左边框的宽度、样式和颜色 */
div {
  border-top-width: 2px;
  border-top-style: solid;
  border-top-color: red;
  border-right-width: 3px;
  border-right-style: dashed;
  border-right-color: blue;
  border-bottom-width: 4px;
  border-bottom-style: double;
  border-bottom-color: green;
  border-left-width: 5px;
  border-left-style: groove;
  border-left-color: purple;
}

注意：如果只设置了border-width或border-style，而没有设置border-color，则浏览器会使用默认的颜色。

标签：