css如何讓table里的字居中?下面本篇文章就來給大家介紹一下使用CSS讓table里字居中的方法。有一定的參考價值,有需要的朋友可以參考一下,希望對大家有所幫助。
在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
}
11 | 22 |
22 | 44 |
33 | 66 |
效果圖:
更多前端開發知識,請查閱 HTML中文網 !!