Html <div> 变成 <tr>:正确吗?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7051219/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
<div> into a <tr>: is it correct?
提问by markzzz
Is this code correct?
这段代码正确吗?
<table>
<tr>
<td>...</td>
</tr>
<tr>
<div>...</div>
</tr>
<tr>
<td>...</td>
</tr>
</table>
don't know for semantic (and W3C rules). What can you say about?
不知道语义(和 W3C 规则)。你能说什么?
回答by Felix Kling
No it is not valid. tr
elements can only contain th
and td
elements. From the HTML4 specification:
不,这是无效的。tr
元素只能包含th
和td
元素。从HTML4 规范:
<!ELEMENT TR - O (TH|TD)+ -- table row --> <!ATTLIST TR -- table row -- %attrs; -- %coreattrs, %i18n, %events -- %cellhalign; -- horizontal alignment in cells -- %cellvalign; -- vertical alignment in cells -- >
<!ELEMENT TR - O (TH|TD)+ -- table row --> <!ATTLIST TR -- table row -- %attrs; -- %coreattrs, %i18n, %events -- %cellhalign; -- horizontal alignment in cells -- %cellvalign; -- vertical alignment in cells -- >
回答by Alohci
Not only is it not valid, but it doesn't work! This mark-up
它不仅无效,而且不起作用!这种标记
<table>
<tr>
<td>The First Row</td>
</tr>
<tr>
<div>The Second Row</div>
</tr>
<tr>
<td>The Third Row</td>
</tr>
</table>
Produces this displayed
产生这个显示
The Second Row
The First Row
The Third Row
The div is ejected entirely from the table and placed before it in the DOM
div 完全从表格中弹出并放置在 DOM 中
回答by shanethehat
No, you should not really use a div
inside a table because it is a block level element. You can override the behaviour with CSS, but it will not validate with W3C if that is your goal.
不,您不应该真正div
在表内使用 a,因为它是块级元素。您可以使用 CSS 覆盖该行为,但如果这是您的目标,则不会使用 W3C 进行验证。
回答by SLB
No you should not use a <div>
inside of a <tr>
. You could use it inside <td>
where as the table is a properly nested table, although this may not be best practice. You can actually override display setting of a div or any element. You could actually make a <div>
(which defaults to block) display as a table-cell and vice versa.
不,您不应该使用 a 的<div>
内部<tr>
。您可以<td>
在表是正确嵌套表的地方使用它,尽管这可能不是最佳实践。您实际上可以覆盖 div 或任何元素的显示设置。您实际上可以将<div>
(默认为阻止)显示为表格单元格,反之亦然。
回答by Pir Abdul
This will work in quirks mode, but the browser which is compatible with standard mode will not work depend upon your doctype. Avoiding quirks mode is one of the keys to successfully producing cross-browser compatible web content
这将在 quirks 模式下工作,但与标准模式兼容的浏览器将无法工作,具体取决于您的 doctype。避免怪癖模式是成功制作跨浏览器兼容 Web 内容的关键之一
Some modern browsers have two rendering modes. Quirk mode renders an HTML document like older browsers used to do it, e.g. Netscape 4, Internet Explorer 4 and 5. Standard mode renders a page according to W3C recommendations. Depending on the document type declaration present in the HTML document, the browser will switch into either quirk mode or standard mode. If there is no document type declaration present, the browser will switch into quirk mode.
一些现代浏览器有两种渲染模式。Quirk 模式像以前使用的旧浏览器一样呈现 HTML 文档,例如 Netscape 4、Internet Explorer 4 和 5。标准模式根据 W3C 建议呈现页面。根据 HTML 文档中存在的文档类型声明,浏览器将切换到 quirk 模式或标准模式。如果不存在文档类型声明,浏览器将切换到 quirk 模式。
http://www.w3.org/TR/REC-html32#dtd
http://www.w3.org/TR/REC-html32#dtd
JavaScript should not behave differently; however, the DOM objects that JavaScript operates on may have different behaviors.
JavaScript 的行为不应有所不同;然而,JavaScript 操作的 DOM 对象可能有不同的行为。
回答by daneczech
Let's say your table row has 5 columns in general and you want your div to occupy the full width of the table. The following should do the trick.
假设您的表格行通常有 5 列,并且您希望您的 div 占据表格的整个宽度。以下应该可以解决问题。
<tr>
<td colspan=5>
<div class="some-class">
<p>Hey</p>
</div>
</td>
</tr>