为什么 margin: auto 在默认不会垂直居中，背后是什么原因？
mangojiji 2024-03-13 22:23:30 +08:00 via Android 1470 次点击这是一个创建于 652 天前的主题，其中的信息可能已经有所发展或是发生改变。
margin:auto 默认能够水平居中，而垂直方向不会，是这样吗，为什么，什么原理。
7 条回复 2024-03-14 09:30:13 +08:00
 | 1 samuelclassic 2024-03-13 23:55:59 +08:00 via iPhone 因为水平是定宽，左右等间距就居中了。但是垂直可以一直堆叠，没有确定高度。不知道是不是这样。 |
 | 2 learnshare 2024-03-13 23:59:15 +08:00 有些东西很难说原理，长期发展，各种因素综合的结果 |
 | 3 ZE3kr 2024-03-14 00:38:39 +08:00 via iPhone 因为 block 高度通常默认不是 100vh ，但宽度通常是占满的吧 |
 | 4 vituralfuture 2024-03-14 01:22:10 +08:00 via Android 曾经看过一点 CSS 权威指南第五版，里面应该有这个问题的答案，推荐 op 看看 我只看了几小时，所以也只是似懂非懂。我认为是，HTML 布局本质上还是像文档一样，文字从左到右书写，如果超过了就换行。所以如果想要垂直居中，指定行高是比较符合直觉的 |
 | 5 AV1 2024-03-14 01:24:47 +08:00 垂直居中的前提是要知道容器的高度。 HTML 刚发明的时候，是把网页视为一个可以无限向下渲染的文档。 这个文档并没有一个“初始高度”的概念，所以当时就没考虑垂直居中的需求。 |
 | 6 old9 2024-03-14 07:17:33 +08:00 via Android 看下 css 2.1 规范 10.3.3 节，可以了解为什么左右 margin 可以有居中效果 https://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#blockwidth 以及规范 10.6.3 节，了解为什么上下 margin 不行 https://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html#normal-block |
 | 7 paopjian 2024-03-14 09:30:13 +08:00 你是内部内容设置 margin 吗? 父元素有设置 border 和高度吗, 没有设置的话内外 margin 合并了 https://www.bilibili.com/video/BV12N4y1U7jq |
Select Language