How to set div border color with css

Css method to set div border color: first create an HTML sample file; then define a div; finally set the border by adding attributes such as "border-color" or "border-left-color" to the div Just color.

The operating environment of this article: Windows7 system, HTML5&&CSS3 version, Dell G3 computer.

css adds border color to div

1. css adds borders to the four sides of div

border-color:#000（设置4边边框颜色为黑色）
border-color:+颜色值，即可设置对象边框颜色
border-left-color:#000 设置左边框颜色为黑色
border-right-color:#000 设置右边框颜色为黑色
border-top-color:#000 设置上边框颜色为黑色
border-bottom-color:#000 设置下边框颜色为黑色

Conditions: The object border must be set to exist, The border width must be greater than or equal to 1px before the border color will be displayed and have meaning.

For example:

.div{ 
    border-style: solid; 
    border-width: 1px; 
    border-color: #000;
}

In this way, set the object border to a solid border, the border width (thickness) to 1px, and the border color to black, so that the border color will take effect.

2. Abbreviation simplification of border color style setting

.div{ 
    border-style:solid; 
    border-width:1px; 
    border-color:#000;
}

In this way, the ".div" object border style is set, we can abbreviate it

.div{ 
    border:solid 1px #000;
}

Effect:

The three border values ​​are separated by spaces

Abbreviating the border color style code can save you code and reduce the amount of CSS code.

[Recommended learning: CSS video tutorial]

The above is the detailed content of How to set div border color with css. For more information, please follow other related articles on the PHP Chinese website!