首页
学习
活动
专区
工具
TVP
发布
技术百科首页 >CSS >如何设置CSS的边框样式?

如何设置CSS的边框样式?

词条归属:CSS

在 CSS 中,可以使用 border 属性来设置元素的边框样式。border 属性可以设置边框的宽度、样式和颜色。

下面是 border 属性的语法:

代码语言:javascript
复制
border: [border-width] [border-style] [border-color];

其中,border-width 指定边框的宽度,可以设置为像素、百分比或预定义的值(thin、medium、thick)。默认值为 medium。

border-style 指定边框的样式,可以设置为 solid、dashed、dotted、double 等。默认值为 none。

border-color 指定边框的颜色,可以设置为颜色名、十六进制值、RGB 值等。默认值为黑色。

例如,以下 CSS 代码设置了一个红色、宽度为 2 像素、样式为实线的边框:

代码语言:javascript
复制
border {
  border: 2px solid red;
}

除了 border 属性之外,还可以使用 border-width、border-style、border-color 分别设置边框的宽度、样式和颜色,例如:

代码语言:javascript
复制
border {
  border-width: 2px;
  border-style: solid;
  border-color: red;
}

还可以使用 border-top、border-right、border-bottom、border-left 分别设置上、右、下、左四个方向的边框样式,例如:

代码语言:javascript
复制
border {
  border-top: 2px solid red;
  border-right: 1px dotted blue;
  border-bottom: 3px dashed green;
  border-left: 1px solid black;
}

相关文章
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
领券