使用 colspan 时出现双虚线边框 [英] Double dotted border while using colspan
问题描述
我遇到了一个看似简单的问题,但在网上搜索没有任何结果.
I have what seems like a simple problem, but searching the net hasn't yielded any results.
我有一张桌子
<table>
<tr>
<td colspan="3">
<img src="something.png" />
</td>
</tr>
<tr>
<td>
Hello
</td>
<td>
World
</td>
<td>
!
</td>
</tr>
</table>
The 此元素具有双边框,因此显示为实线,删除 This element has a double border and so appears as a solid line, removing the 我尝试将 I have tried applying 大家有什么想法吗? 将 Adding 我在那个小提琴上添加了一个动态测试用例.单击任意位置,原始/新表的可见性将切换,让您更容易看到差异. I've added a dynamic test case to that fiddle. Click anywhere, and the visibility of the original/new table will toggle, allowing you to see the difference much easier. 另一种摆脱意外边界的方法是在包含 Another way to get rid off the unexpected border is to add a plain 这篇关于使用 colspan 时出现双虚线边框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!<tr>
元素都有 border-top: dotted 1px black
,除了中央 ,这很好用> 第二个 中的元素.
<tr>
elements all have border-top: dotted 1px black
, this works fine apart from the central <td>
element in the second <tr>
.colspan
可解决此问题.colspan
fixes the issue. border-collapse: collapse
应用于表格,但这没有用,我尝试以
的形式添加内容在第一个 <td>
而不是图像中,这也不起作用.border-collapse: collapse
to the the table and this hasn't worked, I have tried adding content in the form of
inside the first <td>
instead of an image and this hasn't worked either.推荐答案
border-collapse: separate;
添加到您的表中可修复该问题,请参阅 http://jsfiddle.net/quyMy/border-collapse: separate;
to your table fixes the issue, see http://jsfiddle.net/quyMy/
>.<tr></tr>
after the row containing <td colspan=3>
.
登录
关闭