gpt4 book ai didi

html - Rowspan 不使用顶行

转载 作者:行者123 更新时间:2023-11-28 12:05:16 27 4
gpt4 key购买 nike

我不明白为什么我的列不会跨越我创建的顶部和底部行。它应该看起来像“今天”栏的顶部和底部比其他栏高。

这是很多代码,我不确定在不变形或添加新变量(它需要流体高度)的情况下我应该削减什么。JSFiddle:http://jsfiddle.net/DaAwesomeP/aU9Le/

基本 HTML 布局:

<table id="weatherForecast">
<tr class="weatherForecast-row-outer">
<td></td>
</tr>
<tr id="weatherForecast-row">
<td id="weatherForecast-DATE" class="weatherForecast-day weatherForecast-day-today" rowspan="3">
<!-- Cell Content for "Today" Here -->
<td id="weatherForecast-DATE" class="weatherForecast-day ">
<!-- Cell Content Here -->
</td>
</tr>
<tr class="weatherForecast-row-outer">
<td></td>
</tr>
</table>

这是一张显示我想要的图像:

最佳答案

表格标记违反了 HTML 表格模型规则,作为 W3C HTML Validator告诉您是否在 HTML5 模式下使用它。

由于第二行有两个单元格,因此第一行也应该占据两列,因此在其 td 元素上设置 colspan=2

并且您不能使用 rowspan=3,因为表中没有足够的行来跨越。请改用 rowspan=2

很难说出您真正想要什么(绘图会有所帮助),但以下内容至少是有效的 HTML(请注意,我也解决了重复 id 值的问题):

<table id="weatherForecast" border>
<tr class="weatherForecast-row-outer">
<td colspan=2></td>
</tr>
<tr id="weatherForecast-row">
<td id="weatherForecast-DATE" class="weatherForecast-day weatherForecast-day-today" rowspan="2">
<!-- Cell Content for "Today" Here -->
<td id="weatherForecast-DATE2" class="weatherForecast-day ">
<!-- Cell Content Here -->
</td>
</tr>
<tr class="weatherForecast-row-outer">
<td></td>
</tr>

关于html - Rowspan 不使用顶行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19736096/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com