CSS 表格
关于表格的CSS属性不多。
empty-cells
如果在一个表格中有空单元格，可以使用empty-cells属性来指定是否显示空单元格的边框。
SRE实战 互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。empty-cells 属性有3个值：
- show 显示单元格边框
- hidde 隐藏单元格边框
- inherit 如果一个表格嵌套在另一个表格中，单元格边框是否显示根据外部表格的规则
示例
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 | <!DOCTYPE html> < html lang = "en" > < head > < meta charset = "UTF-8" > < title >单元格边框</ title > < style > td { border: 1px solid #E3722E; padding: 15px; } table.one { empty-cells: show;} table.two { empty-cells: hide;} </ style > </ head > < body > < h1 >软件开发，成就梦想</ h1 > < h2 >学编程，上利永贞网 https://www.liyongzhen.com/</ h2 > < table class = "one" > < tr > < td >1</ td > < td >2</ td > </ tr > < tr > < td >3</ td > < td ></ td > </ tr > </ table > < table class = "two" > < tr > < td >1</ td > < td >2</ td > </ tr > < tr > < td >3</ td > < td ></ td > </ tr > </ table > </ body > </ html > |
单元之间空隙
控制单元之间空隙有两个属性，一个收拢，一个是展开。
border-spacing 属性将单元之间的空隙增大，它两个两个值，单位是像素、EM、百分比。第一个值是左右两边的空隙增大，第二个值是上下两边的值增大。
border-collapse 有3个值：
- separate：默认值。边框会被分开。不会忽略border-spacing 和 empty-cells 属性。
- collapse：如果可能，边框会合并为一个单一的边框。会忽略border-spacing 和 empty-cells 属性。
- inherit：规定应该从父元素继承border-collapse属性的值。
示例
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 | <!DOCTYPE html> < html lang = "en" > < head > < meta charset = "UTF-8" > < title >单元之间空隙</ title > < style > td { border: 1px solid #E3722E; padding: 15px; color:#fff; } table.one { border-spacing:10px 4px; } table.two { border-collapse: collapse; } </ style > </ head > < body > < h1 >软件开发，成就梦想</ h1 > < h2 >学编程，上利永贞网 https://www.liyongzhen.com/</ h2 > < table class = "one" > < tr > < td >1</ td > < td >2</ td > </ tr > < tr > < td >3</ td > < td >4</ td > </ tr > </ table > < table class = "two" > < tr > < td >1</ td > < td >2</ td > </ tr > < tr > < td >3</ td > < td >4</ td > </ tr > </ table > </ body > </ html > |
更多精彩
