display: table-cell; text-align: center;为啥不能实现水平居中
来源：3-2 垂直居中布局的第一种解决方案
Bare
2020-03-10 11:59
老师按照你上面讲的垂直居中 table 原理
父元素 display: table-cell; text-align: center 为啥不能实现水平居中?
写回答
关注
3回答
-
- ccyy_阿亮
- 2020-12-01 18:07:57
vertical-align是设置在内联元素或者单元格上的。前者是让内联元素本身在一行里进行某种垂直对齐。后者是让单元格内部的整个内容相对于单元格这个容器进行某种垂直对齐方式。
而text-align是设置在块级元素上，让内部的内联子元素进行水平对齐的。
text-align还是好理解一些，设置在父容器，让子元素去对齐。vertical-align一般设置在内联元素本身（看作设置在子元素上），让它自己相对于line box（内联元素的容器）去对齐；特殊场景，vertical-align设置在父容器单元格上，让子元素去对齐。
-
- 969999666696
- 2020-07-23 11:46:10
因为 text-align 对作为块级元素的子元素无效，但子元素的文本会继承 text-align 的效果导致该文本在子元素内水平居中。
-
- 慕粉18380451249
- 2020-03-14 15:39:47
子元素的文案是居中，并且是可以继承的。块级子元素不能居中。
一课全面掌握主流CSS布局
一网打尽CSS主流布局方案，一步掌握页面布局技巧.
5276 学习 · 60 问题
相似问题
水平垂直居中
回答 3
为什么实现不了居中？求解
回答 1