“外面”表格围绕着它的单元格.我希望我的“里面”表格在它的单元格之间有边界,所以我结束了“拆分”现有(“外部”)单元格的效果.
如果它使事情更清晰,这就是我所拍摄的,像(穷人)ascii艺术:
----------------- | | | | | | | ----------- | | | | | | ----------- | | | | | | | -----------------
(“内部”表格看起来像一个tic-tac-toe网格;“外部”表格的单元格具有不间断的边框)
我环顾四周,发现了一个< table>属性称为RULES,这听起来像这样做.然而,它似乎不太支持,反正我不应该把风格放在标记(对吗?).我发现的文档说“使用CSS”,但是我似乎找不到一种简单的方式来说“在单元格之间放置一个边界,但是如果单元格的边缘在CSS的外部触摸到外部” .帮帮我?
解决方法
table{ table-layout:fixed; border-collapse:separate; border-spacing:0.25em; border:1px solid red; } tr{ display:block; border-bottom:1px dashed blue; } tr:last-child{ border:0; } td{ padding-right:0.25em; vertical-align:top; border:1px dotted orange; border-width:0 1px; } td:first-child,td + td{ border-left:0; } td:last-child{ padding-right:0; border-right:0; }
编辑
重新读取后,我意识到您没有在单个表中查找分隔的边框,而是仅限制嵌套表之间的单元格之外的边框.这更简单http://codepen.io/morewry/pen/yxvGg:
table{ table-layout:fixed; border-collapse:collapse; border-spacing:0; border-style:hidden; } td{ padding:0.25em; border:1px solid black; }
边框冲突解决方案指出,border-style:hidden优先,因此在折叠模型中出现的唯一一个在单元格之间.
这里唯一的问题是IE不支持隐藏,因此对于IE,您需要解决方法.伪类应该适用于IE8.我不认为IE7支持:最后一个孩子,所以需要一些额外的帮助,IE6将需要一个解决方法:first-child和:last-child.
对于IE8和IE7,以下将模拟border:hidden
table{ border:2px solid transparent; }
在这些浏览器中,您将获得2个额外的透明空间像素,但效率更高.我记得IE6并不能正确支持透明边界,但仍然有问题.见http://codepen.io/morewry/pen/bIvJa.
原文地址:https://www.jb51.cc/html/224107.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。