这不是另一个一般的“一般布局的表格与 div 元素”类型的问题,例如“为什么不使用表格来布局” https://stackoverflow.com/questions/83073/why-not-use-tables-for-layout-in-html问题。
我正在开发一个时间表/日历项目,并且我一直认为日历是何时使用表格的示例。尽管快速浏览一下 Google 日历的结构后,它似乎由一个表组成,其中包含一个<td>
对于每一列以及每一列内,一个事件是<div>
里面有定义列表。
为什么这有好处?
我自己的想法:
- 当有多个不同长度的事件同时开始时(以相同的时间开始),表格的样式可能会更麻烦,要漂亮且紧凑。
<td>
)。可能出现不需要的空白。
- 当用户在页面加载后添加事件时,更新表会变得更加困难,例如使用 JavaScript(因为表头的行/列跨度可能必须更改)
- 如果使用表格,x 轴/顶部标题和单元格的宽度以及 y 轴/左侧标题和单元格的高度将自动匹配。如果没有表格,管理起来可能会很困难。
这有关系吗?应该表格数据always存储在实际的表中?
下面是一个简化的Google 日历列的示例:
<td> <!-- column -->
<div> <!-- start event -->
<dl>
<dt>START TIME – END TIME </dt>
<dd>EVENT TITLE</dd>
</dl>
</div> <!-- end event -->
</td> <!-- end column -->
以下是一个完整的示例:
<td class="tg-col"> <!-- column td -->
<div id="tgCol0" class="tg-col-eventwrapper" style="height:1008px;margin-bottom:-1008px;"> <!-- column div -->
<div class="tg-gutter">
<div class="ca-evp130 chip " style="top:588px;left:-1px;width:100%;"> <!-- start event div -->
<dl class="cbrd" style="height:35px;border-color:#9FC6E7;background-color:#E4EFF8;color:#777777;">
<dt style="background-color:;">START TIME – END TIME <i class="cic cic-dm cic-rcr" title="Recurring event"> </i></dt>
<dd><span class="evt-lk ca-elp130">EVENT TITLE</span></dd>
<div><!-- start masks -->
<div class="mask mask-top" style="border-color:#9FC6E7;background-color:#E4EFF8;"> </div>
<div class="mask mask-bottom" style="border-color:#9FC6E7;background-color:#E4EFF8;"> </div>
<div class="mask mask-left" style="height:38px;border-color:#9FC6E7;background-color:#E4EFF8;"> </div>
<div class="mask mask-right" style="height:38px;border-color:#9FC6E7;background-color:#E4EFF8;"> </div>
</div><!-- end masks -->
<div class="resizer"> <!-- start resizer -->
<div class="rszr-icon"> </div>
</div> <!-- end resizer -->
</dl>
</div> <!-- end event div -->
</div>
</div> <!-- end column td -->
<div id="tgOver0" class="tg-col-overlaywrapper"></div> <!-- column overlay div -->
</td> <!-- end column td -->
Edit:
不要忘记说明 Google 日历的结构为何如此,例如为什么 Google 日历有一个表格但仅将其用于列?
就我个人而言,我会选择 div 而不是表格。这并不是说表格完全错误,只是 div 在设计样式时可以更加灵活,特别是如果您添加其他元素(例如可能跨越 2 个日期的会议)等。
Div 也比表格更有利于流畅的布局。
它既是又不是表格数据,我想这取决于您对其功能和布局的了解程度。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)