我有一个HTML表格,其中包含各种大小的内容。有些可能是一个段落。
我想要完成的只是让单元格自动调整高度以支持各种内容,而不是给每一行固定大小(因为看起来很糟糕)。
<td align="left" width="10%" height="130"><div>{{this.val8}}</div></td>
<td align="left" height="130"><div>{{{this.val7}}}</div></td>
<td align="left" height="130"><div>{{this.val6}}</div></td>
<td align="left" height="130"><div>{{this.val}}</div></td>
<td height="130" width="80%"><div>{{{this.val0}}}</div></td>
<td height="130"><div>{{{this.val8}}}</div></td>
<td align="right" width="80%" height="130"><div>{{{this.val1}}}</div></td>
<td align="right" width="80%" height="130"><div>{{{this.val2}}}</div></td>
<td height="130" width="75%"><div>{{{this.val3}}}</div></td>
<td height="130"><div>{{this.val4}}</div></td>
<td height="130"><div>{{this.val5}}</div></td>
现在,我已经确定了每个细胞的高度。一般来说,大多数细胞适合这个高度,但我喜欢那些不小的细胞。
任何提示或建议都会很棒。
谢谢!
答案 0 :(得分:1)
只需删除所有高度属性即可。另请注意,高度和宽度属性都已过时 - 改为使用样式。
答案 1 :(得分:1)
让我们为初学者清理你的标记:
<table>
<tr>
<td align="left">
{{this.val8}}
</td>
<td align="left">
{{this.val7}}
</td>
<td align="left">
{{this.val6}}
</td>
<td align="left">
{{this.val}}
</td>
<td>
{{this.val0}}
</td>
<td>
{{this.val8}}
</td>
<td align="right">
{{this.val1}}
</td>
<td align="right">
{{this.val2}}
</td>
<td>
{{this.val3}}
</td>
<td>
{{this.val4}}
</td>
<td>
{{this.val5}}
</td>
</tr>
</table>
如果需要为单元格设置垂直对齐方式,请使用:
td { vertical-align:top; }