How to set table border lines to different colors in html5

In HTML5, you can use the "border-color" attribute to set the table border lines to different colors. This attribute is an abbreviated attribute that can set 1 to 4 values ​​​​to set the four borders respectively. Color, the syntax is "border-color: top border color, right border color, bottom border color, left border color;".

The operating environment of this tutorial: Windows 10 system, HTML5 version, Dell G3 computer.

html5How to set table border lines to different colors

border-color property sets the color of the four borders. This property can set from 1 to 4 colors.

The border-color property is a shorthand property that can set the color of the visible parts of all borders of an element, or set different colors for each of the 4 sides. Please look at the following example:

Example 1

border-color:red green blue pink;

The upper border is red

The right border is green

The lower border is blue

The left border is pink

Example 2

border-color:red green blue;

The upper border is red

The right and left borders are green

The lower border is blue

Example 3

border-color:dotted red green;

The upper and lower borders are red

The right and left borders are green

Example 4

border-color:red;

All The four borders are all red

Remember that the border style cannot be none or hidden, otherwise the border will not appear.

Recommended tutorial: "html video tutorial"

The above is the detailed content of How to set table border lines to different colors in html5. For more information, please follow other related articles on the PHP Chinese website!