为什么边界< tr>不显示在IE？ [英] Why border of <tr> not showing in IE?
问题描述
为什么 tfoot tr：first-child 的边框在IE中不显示。我在检查IE7。
Why border of tfoot tr:first-child not showing in IE. I'm checking in IE7.
font-weight：bold;背景：黄色显示在IE中，但边框不是
font-weight:bold; background:yellow is showing in IE but border not
table {
border-collapse: collapse;
border-spacing: 0;
}
table tfoot tr:first-child {
font-weight:bold;
background:yellow;
border-top:2px solid red;
border-bottom:2px solid red;
}
HTML
<table cellpadding="0" cellspacing="0">
<thead>
<tr>
<th align="left" scope="col">XXXX</th>
<th align="right" scope="col">XXXX</th>
<th align="right" scope="col">XXXX</th>
<th align="right" scope="col">XXXX</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="3">XXXX</td>
<td align="right">XXX</td>
</tr>
<tr>
<td colspan="4">XXX</td>
</tr>
</tfoot>
<tbody>
<tr>
<td align="left">XXXX</td>
<td align="right">XXXX</td>
<td align="right">XXXX</td>
<td align="right">XXXX</td>
</tr>
</tbody>
</table>
更新：
this doctype
i'm using this doctype
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
推荐答案
我会避免使用样式 tr 元素，因为它们不是真正存在本身，除了语义原因。你最好选择定位表格单元格本身，具体如下：
I would avoid styling tr elements because they don't really "exist" as such, apart from for semantic reasons. You're better off targeting the table cells themselves, with something like this:
table tfoot tr:first-child th,
table tfoot tr:first-child td {
font-weight:bold;
background:yellow;
border-top:2px solid red;
border-bottom:2px solid red;
}
此外，由于您直接定位嵌套元素，因此可以使用子选择器，这是浏览器解析的速度更快（他们只需要搜索一级上/下）。
Also, since you are targeting directly nested elements, you can use the child selector, which is faster for browsers to parse (they only have to search one level up/down).
table > tfoot > tr:first-child > th,
table > tfoot > tr:first-child > td {
...
}
这篇关于为什么边界< tr>不显示在IE？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
