表中两行之间的空格？

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>>

这可能通过CSS吗？

我尝试着

tr.classname {
  border-spacing: 5em;
}

无济于事。也许我做错了什么？

#1楼

为表提供间距的正确方法是使用cellpadding和cellspacing例如

<table cellpadding="4">

#2楼

你需要设置border-collapse: separate; 在桌子上; 大多数浏览器默认样式表从border-collapse: collapse;开始border-collapse: collapse; ，边沟间隔。

另外，边界间距：在TD而不是TR 。

尝试：

<html><head><style type="text/css">
    #ex    { border-collapse: separate; }
    #ex td { border-spacing: 1em; }
</style></head><body>
    <table id="ex"><tr><td>A</td><td>B</td></tr><tr><td>C</td><td>D</td></tr></table>
</body>

#3楼

要创建行间距的错觉，请将背景颜色应用于行，然后创建一个白色的粗边框，以便创建“空格”:)

tr 
{
   background-color: #FFD700;
   border: 10px solid white;
}

#4楼

来不及答案:)

如果将float应用于tr元素，则可以在具有margin属性的两行之间tr空格。

table tr{
float: left
width: 100%;
}

tr.classname {
margin-bottom:5px;
}

#5楼

我在遇到类似问题时偶然发现了这一点。我发现Varun Natraaj的答案非常有帮助，但我会使用透明边框代替。

td { border: 1em solid transparent; }

透明边框仍然有宽度。

来源：oschina

链接：https://my.oschina.net/u/3797416/blog/3145894

标签

border-collapse

易学教程内所有资源均来自网络或用户发布的内容，如有违反法律规定的内容欢迎反馈！
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!