热门：华为支持参数分辨率解决方法控制属性启动升级错误平台推荐步骤模式查询运行空间文件夹鼠标图标重启激活联想检查状态应用程序

css如何设置表格边框不重叠？

2022-10-25 22:50:52

当我们遇到给表格table设置边框的情况，但效果总是达不到预期；例如因重复设置而加粗，破坏了整体效果，下面与大家分享下两种设置单线边框的css样式，感兴趣的朋友可以参考下，希望对大家有所帮助。

css如何设置表格边框不重叠？

一、设置css属性border-collapse:collapse。

table{ 
    border-collapse:collapse; 
} 
table tr{ 
    border:1px solid red; 
}

border-collapse:collapse属性设置表格的边框被合并为一个单一的边框

二、设置td上边框，并取消table上边框。推荐学习：CSS视频教程 

table tr td{ 
    border-top:1px solid red; 
} 
table{ 
    border:1px solid red; 
    border-top-width:0px; 
}

效果：

本文来自PHP中文网，CSS教程栏目，欢迎学习

以上就是css如何设置表格边框不重叠？的详细内容，更多请关注易知道|edz.cc其它相关文章！

边框重叠属性设置情况

推荐阅读