border 属性用于同时设置一个元素的所有四个边框(上、右、下、左)。该属性可以接受三个值,分别是边框宽度、边框样式和边框颜色。

以下是 border 属性的基本语法:
border: border-width border-style border-color;

各个子属性的说明如下:

1. border-width: 用于设置边框的宽度。可以是一个具体的长度值,如像素、百分比,也可以是关键词值如 thin、medium、thick,或者是由长度值组成的四个值(上、右、下、左)。
    border-width: 2px; /* 具体长度值 */
    border-width: medium; /* 关键词值 */
    border-width: 2px 4px 6px 8px; /* 四个值分别对应上、右、下、左 */

2. border-style: 用于设置边框的样式。常见的样式包括 solid、dashed、dotted、double 等。
    border-style: solid; /* 实线 */
    border-style: dashed; /* 虚线 */
    border-style: dotted; /* 点线 */
    border-style: double; /* 双线 */

3. border-color: 用于设置边框的颜色。可以是一个颜色值,也可以是由颜色值组成的四个值(上、右、下、左)。
    border-color: #3498db; /* 单个颜色值 */
    border-color: #3498db #2ecc71 #e74c3c #f39c12; /* 四个值分别对应上、右、下、左 */

例如:
.element {
  border: 2px solid #3498db;
}

上述代码设置了元素的边框宽度为2像素,样式为实线,颜色为蓝色。


转载请注明出处:http://www.zyzy.cn/article/detail/6000/CSS