元素并列时,CSS控制边框不重叠显示
一、父级设置边框,并设置溢出时隐藏。设置子元素的高度稍高于父元素,子元素只设置两边边框,实现子元素被边框包围效果而不出现边框重叠。
二、使用nth-child伪类来实现。
1、所有元素设置左/下边框。
2、第一行元素设置上边框
3、每行最末元素设置右边框
三、直接设置元素四个方向的边框,但通过左外边距将元素往左移动边框宽度的距离(上边距往上移)
推荐方法三,Bootstrap中的按钮组使用此方法
一、父级设置边框,并设置溢出时隐藏。设置子元素的高度稍高于父元素,子元素只设置两边边框,实现子元素被边框包围效果而不出现边框重叠。
二、使用nth-child伪类来实现。
1、所有元素设置左/下边框。
2、第一行元素设置上边框
3、每行最末元素设置右边框
三、直接设置元素四个方向的边框,但通过左外边距将元素往左移动边框宽度的距离(上边距往上移)
推荐方法三,Bootstrap中的按钮组使用此方法