How to remove the repeated borders of a table by css
This article mainly shows you "css how to remove the repeated borders of the table", the content is easy to understand, well-organized, hope to help you solve your doubts, the following let the editor lead you to study and learn "css how to remove the repeated borders of the table" this article.
In css, you can use the border-collapse property to remove repeated borders in the table, which can set whether the table border is folded to a single border or separate, as long as the value is set to collapse, the overlapping borders can be merged together to form a border to achieve the effect of a single-line border.
The operating environment of this tutorial: windows7 system, CSS3&&HTML5 version, Dell G3 computer.
The problem of overlap after setting the border in the table {border-spacing: 0; border-collapse: collapse;} table td {border: 1px solid # 000; padding: 20px 30px;}
In the table table, when we add a border, and remove the margins of each cell, the form will have the problem of border overlap, making the border line thicker, then we can set border-collapse: collapse to set the border, which combines the overlapping borders together to form a border to achieve the effect of a single-line border.
Effect picture:
Description:
The border-collapse property sets whether the borders of the table are merged into a single border or are displayed separately as in standard HTML.
Attribute value:
Separate default value. The frame will be separated. The border-spacing and empty-cells properties are not ignored.
Collapse, if possible, the borders are merged into a single border. The border-spacing and empty-cells properties are ignored.
The above is all the content of the article "how to remove the repeated borders of the table by css". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!
