Html 表格单元格中文本的垂直对齐
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5943166/
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
Vertical Alignment of text in a table cell
提问by AKor
Here's a portion of my table (it's a form):
这是我的表格的一部分(它是一个表格):
Those are just two <td>
's in a <tr>
. I'm trying to get Descriptionup top, to the top of the table cell, rather than resting on the bottom.
这些只是两个<td>
的一个<tr>
。我试图将描述放在表格单元格的顶部,而不是放在底部。
How can I do that?
我怎样才能做到这一点?
回答by clairesuzy
td.description {vertical-align: top;}
where description
is the class name of the td
with that text in it
包含该文本description
的类名在哪里td
td.description {
vertical-align: top;
}
<td class="description">Description</td>
OR inline (yuk!)
或内联(yuk!)
<td style="vertical-align: top;">Description</td>
回答by DTS
Try
尝试
td.description {
line-height: 15px
}
<td class="description">Description</td>
Set the line-height value to the desired value.
将 line-height 值设置为所需的值。
回答by Richard
If you are using Bootstrap, please add the following customised style setting for your table:
如果您使用的是 Bootstrap,请为您的表添加以下自定义样式设置:
.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
vertical-align: middle;
}
回答by morgar
valign="top"
should do the work.
valign="top"
应该做的工作。
<tr>
<td valign="top">Description</td>
</tr>
回答by Razzi
I had the same issue but solved it by using !important
. I forgot about the inheritance in CSS
. Just a tip to check first.
我有同样的问题,但通过使用!important
. 我忘记了CSS
. 只是一个提示,首先检查。
回答by Mano
Just add vertical-align:top for first td alone needed not for all td.
只需为第一个 td 添加 vertical-align:top 不需要所有 td。
tr>td:first-child {
vertical-align: top;
}
<tr>
<td>Description</td>
<td>more text</td>
</tr>