有关 vertical-align: middle 的疑问

2015-07-25 13:06:55 +08:00
 sneezry
vertical-align: middle在w3school上的解释为将元素放置在父元素的中部,代码语义上也确实吻合这一解释。但是翻阅w3c文档时,上面的解释是这样的:

Align the vertical midpoint of the box with the baseline of the parent box plus half the x-height of the parent.

将元素的垂直中点与父系元素的基线加上半高对齐。

[ 见 http://www.w3.org/wiki/CSS/Properties/vertical-align ]

这就和w3school的解释不同了,基线不是底线啊,所以按照w3c的解释,vertical-align: middle的元素垂直中线与父系元素的垂直中线还差个父系元素底线与基线之间的距离呢啊~

不过实际测试时,感觉w3school的解释是正确的,但是w3c文档才是权威啊~我现在整个人都拧巴了~
2090 次点击
所在节点    问与答
4 条回复
loading
2015-07-25 13:15:28 +08:00
http://www.educity.cn/jianzhan/630291.html

baseline 在行高上也比较麻烦。
sneezry
2015-07-25 13:22:40 +08:00
@loading 懂了,x-height我理解错了
ZoomZhao
2015-07-25 13:29:07 +08:00
如果讲语义的话,vertical-align: text-middle 更合适
sneezry
2015-07-25 13:38:33 +08:00
@ZoomZhao 目前的middle倒是更像文字中部,哈哈。看来想玩父系元素居中,妥妥地直接用定位吧

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/208238

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX