DIV表colspan:怎么样？

Question

DIV表colspan:怎么样？

art*_*ave 41 html css

如何在无div.table {display: table;} div.tr {display: table-row;} etc.表(例如)表中实现colspan/rowspan行为？

Answer 1

Que*_*tin 15

我想这会被CSS表覆盖,这个规范虽然在CSS主页上提到,但目前似乎处于"尚未以任何形式发布"的状态

实际上,你目前无法做到这一点.

这仍然是这样吗？ (17认同)

Answer 2

Spu*_*ley 13

所以基本上,你把你的所有<table>,<tr>并<td>元素融入<div>元素,风格他们工作完全一样,他们已经取代了原来的表格元素？

有什么意义呢？

听起来好像有人在告诉你,你不应该在现代网页设计,这是一个使用表格的排序正确的,但不能以这种方式-你做了什么并不真正改变你的代码的任何事情.它当然没有摆脱桌子; 它只是让它更难阅读.

关于不在现代站点中使用表的观点的真正含义是实现所需的页面布局,而不使用涉及设置表格单元网格的布局技术.

这是通过使用position样式和float样式以及许多其他方式实现的,但肯定不是display:table-cell;等等.所有这些都可以在不需要colspans或rowpans的情况下实现.

另一方面,如果您尝试在页面上放置一个实际的表格数据块 - 例如购物篮中的项目和价格列表,或一组统计数据等,那么表格仍然是正确的解决方案.表格未从HTML中删除,因为它们仍然相关且仍然有用.关键是可以使用它们,但仅限于实际显示数据表的地方.

对你的问题的简短回答是我认为你不能 - colspan并且rowspan特定于表格.如果要继续使用它们,则需要使用表格.

如果你的页面布局是依赖于表格的,那么在没有重新设计布局的方法的情况下,实际上没有任何一点可以去除表格元素.它没有实现任何目标.

希望有所帮助.

其中的一点是元素的语义和它呈现的方式是不同的.如果CSS规范已达到表达表格标记所隐含的与表示相关的所有内容的阶段,并且浏览器已经赶上了,那么这将是获得表格布局优势的一种很好的方式(调整元素沿指定的方式粘在一起)没有语义上的缺点(直言不讳地说明了数据的含义). (16认同)
@Spudley - 尽管在大多数情况下使用<table>更适合表格式表示,但在某些情况下我遇到过CSS方式似乎更合适的情况.例如 - 如果您想要以一种漂亮的表格方式显示多个但外观相似的表单,则无法单独使用表来实现这一点,因为只有一个表单可以包装在一个表中.你可以有多个表 - 每个表单一个,但如果没有一些CSS调整它们看起来不整齐,而CSS/DIV方式实际上是一种更好的方法. (4认同)

Answer 3

Nic*_*ulu 13

你可以简单地使用两个表格div,例如:

<div style="display:table; width:450px; margin:0 auto; margin-top:30px; ">
  <div style="display:table-row">
    <div style="width:50%">element1</div>
    <div style="width:50%">element2</div>
  </div>
</div>
<div style="display:table; width:450px; margin:0 auto;">
  <div style="display:table-row">
    <div style="width:100%">element1</div>
  </div>
</div>

Run Code Online (Sandbox Code Playgroud)

效果很好!

这似乎只有在所有div都设置了明确的宽度时才会起作用,这种方式会破坏`display:table`的目的. (14认同)

归档时间：	14 年，7 月前
查看次数：	115108 次
最近记录：	8 年，5 月前