html表格内文字置顶,css如何让table里的字居中?

css如何让table里的字居中?下面本篇文章就来给大家介绍一下使用CSS让table里字居中的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

5fe868afc36e243d205bf68b98a747f3.png

在CSS中,可以通过设置text-align: center;和vertical-align:middle;来让table里的字水平居中和垂直居中。

text-align属性

text-align属性指定元素文本的水平对齐方式。

属性值:left:把文本排列到左边。默认值:由浏览器决定。

right:把文本排列到右边。

center:把文本排列到中间。

justify:实现两端对齐文本效果。

vertical-align属性

vertical-align属性设置一个元素的垂直对齐方式。

该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中,这个属性会设置单元格框中的单元格内容的对齐方式。

属性值:baseline:默认。元素放置在父元素的基线上。

sub:垂直对齐文本的下标。

super:垂直对齐文本的上标

top:把元素的顶端与行中最高元素的顶端对齐

text-top:把元素的顶端与父元素字体的顶端对齐

middle:把此元素放置在父元素的中部。

bottom:把元素的底端与行中最低的元素的顶端对齐。

text-bottom:把元素的底端与父元素字体的底端对齐。

length

%:使用 "line-height" 属性的百分比值来排列此元素。允许使用负值。

示例:

table,td {

text-align: center;

vertical-align:middle;

border-style: solid

}

1122
2244
3366

效果图:

65cd9a4fc2b9d57212880b140ef85dbf.png

更多前端开发知识,请查阅 HTML中文网 !!