色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css表格中文字在底部居中

錢甲書1年前5瀏覽0評論

CSS表格中文字在底部居中是網頁設計中比較基礎的操作,下面介紹一個簡單的代碼實現方法。

table {
border-collapse: collapse; /*設置表格邊框合并*/
width: 100%;
}
th,
td {
border: 1px solid #ddd; /*設置表格邊框*/
text-align: center; /*設置文字居中*/
vertical-align: bottom; /*文字在底部*/
padding: 8px; /*設置單元格內邊距*/
}

以上代碼實現了邊框合并、文字居中、文字在底部以及單元格內邊距四個操作。

其中,border-collapse屬性用于實現表格邊框合并,使相鄰單元格的邊框合并為一個;text-align屬性用于實現文本的水平居中;vertical-align屬性用于實現文本的垂直居中,這里選用了底部對齊方式;padding屬性用于實現單元格內邊距的設置,避免文本和邊框挨得太緊。

此外,還有一種使用display屬性實現文本在底部居中的方法。

td {
display: flex; /*設置為彈性盒子*/
align-items: flex-end; /*設置垂直居底*/
justify-content: center; /*設置水平居中*/
}

以上代碼中,display屬性將單元格設置為彈性盒子,align-items屬性設置了垂直方向上的對齊方式為底部對齊,justify-content屬性設置了水平方向上的對齊方式為居中。

總之,實現表格中文字在底部居中的方法比較簡單,只需要掌握這幾個CSS屬性即可。