css border边框样式

2023-03-30 15:40:37 CSS的border属性用于设置HTML元素的边框样式、宽度和颜色。

CSS的border属性用于设置HTML元素的边框样式、宽度和颜色。下面是border属性的常用语法:

border: [border-width] [border-style] [border-color];

或者分别设置border-width、border-style和border-color属性:

border-width: [top] [right] [bottom] [left];
border-style: [top] [right] [bottom] [left];
border-color: [top] [right] [bottom] [left];

其中,[border-width]指定边框的宽度,[border-style]指定边框的样式,[border-color]指定边框的颜色。每个值都可以单独指定,也可以使用一个值来设置四个边框的样式、宽度和颜色。

例如,设置一个红色、宽度为1像素、实线样式的边框,可以使用以下代码:

border: 1px solid red;

还可以分别设置每个边框的样式、宽度和颜色,例如:

border-top: 1px solid blue;
border-right: 2px dotted green;
border-bottom: 3px dashed yellow;
border-left: 4px double black;

上述代码将会设置一个顶部边框宽度为1像素、实线样式、蓝色颜色;右边框宽度为2像素、点状样式、绿色颜色;底部边框宽度为3像素、虚线样式、黄色颜色;左边框宽度为4像素、双线样式、黑色颜色。

更新