html中表格与字对齐,html – 中心与表格单元格对齐 -ag凯发k8国际

这是一个很好的起点。

html：

css：

.containing-table {

display: table;

width: 100%;

height: 400px; /* for demo only */

border: 1px dotted blue;

}

.centre-align {

padding: 10px;

border: 1px dashed gray;

display: table-cell;

text-align: center;

vertical-align: middle;

}

.content {

width: 50px;

height: 50px;

background-color: red;

display: inline-block;

vertical-align: top; /* removes the extra white space below the baseline */

}

.containing-table为.centre-align(表格单元格)建立宽度和高度上下文。

您可以根据需要应用text-align和vertical-align来改变.centre-align。

请注意，.content需要使用display：inline-block，如果要使用text-align属性水平居中。

总结

以上是ag凯发k8国际为你收集整理的html中表格与字对齐,html – 中心与表格单元格对齐的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得ag凯发k8国际网站内容还不错，欢迎将ag凯发k8国际推荐给好友。