我正在使用 HTML 和 CSS 为一个学校元素创建一个网站。在标题中有一个表格,我需要一个文本(位于单元格内)在垂直中心和水平右侧对齐。
这是HTML代码
<table id="intestazione">
........
<tr>
<td class="centerV"><h1>Text</h1></td>
<td><img src="Logo.jpg"></td>
</tr>
</table>
这是CSS代码
h1
{
font-family:Arial;
font-size:50px;
color:#009ED9;
text-align:right;
}
.centerV
{
display:table-cell;
vertical-align:middle;
}
但是没有如我所愿,所以我把CSS代码改成了
h1
{
font-family:Arial;
font-size:50px;
color:#009ED9;
display:table-cell;
vertical-align:middle;
text-align:right;
}
并且文本垂直居中,但不在右侧(它在左侧)。我读过我可以在顶部使用 line-height
或 padding
,但我认为使用 vertical-align 更干净优雅
(告诉我,如果我错了)。
我也尝试了网络上建议的其他代码,但我没有写它,否则问题会太长。
最佳答案
你可以使用: position:relative; 右:值(value)%; (或左:值(value)%) 随心所欲..
<table id="intestazione" border="1">
<tr>
<td class="centerV"><h1>Text</h1></td>
<td><img src="http://www.sec4ever.com/home/images/misc/noavatar.gif"></td>
</tr>
h1{
font-family:Arial;
font-size:50px;
color:#009ED9;
display:table-cell;
padding:100px;
vertical-align:middle;
position:relative;
right:30%; }
关于html - 无法在表格单元格中垂直居中文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43158711/