Display priority of border-collapse borders

The border-collapse attribute sets whether the border of the adjacent TD in the table is merged into a single border or displayed separately as in standard HTML.

Default Value:	Separate
Inheritance:	Yes
Version:	Css2
JavascriptSyntax:	Object. Style. bordercollapse = "collapse"

 

Value	Description
Separate	Default value. Borders are separated. The border-spacing and empty-cells attributes are not ignored.
Collapse	If possible, the border is merged into a single border. The border-spacing and empty-cells attributes are ignored.
Inherit	Specify that the value of the border-collapse attribute should be inherited from the parent element.

• Which of the following is displayed when the two borders are inconsistent when the border is merged?

(1) first, check the border-width attribute, which has a higher priority than the wide side.


(2) If border-width is the same, check the border-style attribute again. The priority ranges from high to low:
Double, solid, dashed, dotted, ridge, outset, groove, inset
Note: When border-style is double, border-width must be greater than or equal to 3px to see the effect.


(3) If border-width and border-style are the same, the priority ranges from high to low Based on the element type of the edge:
Cell, row, row group, column, column group, table


(4) Border-width, border-style, and element types. If the three elements are the same, the position of the side is displayed first.

Display priority of border-collapse borders