我是靠谱客的博主 朴实月亮,这篇文章主要介绍css怎么让td中的文字居中显示,现在分享给大家,希望可以做个参考。

本教程操作环境:windows10系统、CSS3&&HTML5版、Dell G3电脑。

css怎么让td中的文字居中显示

在css中,可以利用text-align和vertical-align属性来设置td中的文字居中显示,text-align属性用于设置元素的水平对齐方式,vertical-align属性用于设置元素的垂直对齐方式。

当text-align属性属性的值为center时,表示元素水平居中显示,当vertical-align属性的值为middle时,表示元素垂直居中显示。

示例如下:

复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> td{ height:100px; width:50px; text-align:center; vertical-align:middle; } </style> <table border="1"> <tr> <td>111</td> <td>222</td> </tr> <tr> <td>333</td> <td>444</td> </tr> <tr> <td>555</td> <td>666</td> </tr> <tr> <td>777</td> <td>888</td> </tr> </table> </body> </html>
登录后复制

输出结果:

25.png

(学习视频分享:css视频教程)

以上就是css怎么让td中的文字居中显示的详细内容,更多请关注靠谱客其它相关文章!

最后

以上就是朴实月亮最近收集整理的关于css怎么让td中的文字居中显示的全部内容,更多相关css怎么让td中内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(140)

评论列表共有 0 条评论

立即
投稿
返回
顶部