1.table表格整个居中
<div style="text-align: center;">
<table border="1" style="margin: auto;" width='60%'>
......
</table>
</div>
我们在table外围div中加入样式style="text-align: center;",会发现table表格居中不生效,原因最后说。
所以我们在 <table border="1" style="margin: auto">加入style="margin: auto"会发现table表格整个居中。
2.table表格各行各列中内容居中
可以在table外围div中加入样式style="text-align: center;"让表格中内容居中。为了看的清楚可以为table表格设置一个宽度。
或是单独的在<td style="text-align: center;"></td>加入样式都能实现。
为什么style="text-align: center;"不能使table表格整个居中??
答:我们先要明白。text-align:属性代表的是元素中文本的水平对齐方式,说的更具体点就是设置块级元素内文本的水平对齐方式。只针对文本内容。
style="text-align: center;"
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步