css3 模仿 table border-collapse:collapse ,实现相邻元素合并描边

未设置效果

css3 模仿 table border-collapse:collapse ,实现相邻元素合并描边_第1张图片
image.png

已设置效果

css3 模仿 table border-collapse:collapse ,实现相邻元素合并描边_第2张图片
image.png



    
    Document
    
    


    
11 12 13 14
21 22 23 24
31 32 33 34

首先设置所有元素描边,然后通过通用兄弟选择器( ~ ),匹配除第一个外所有的同级元素,取消 border-left 的值。

你可能感兴趣的:(css3 模仿 table border-collapse:collapse ,实现相邻元素合并描边)