V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
sneezry
V2EX  ›  问与答

有关 vertical-align: middle 的疑问

  •  
  •   sneezry · 2015-07-25 13:06:55 +08:00 · 2106 次点击
    这是一个创建于 3410 天前的主题,其中的信息可能已经有所发展或是发生改变。
    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文档才是权威啊~我现在整个人都拧巴了~
    4 条回复    2015-07-25 13:38:33 +08:00
    loading
        1
    loading  
       2015-07-25 13:15:28 +08:00   ❤️ 1
    http://www.educity.cn/jianzhan/630291.html

    baseline 在行高上也比较麻烦。
    sneezry
        2
    sneezry  
    OP
       2015-07-25 13:22:40 +08:00
    @loading 懂了,x-height我理解错了
    ZoomZhao
        3
    ZoomZhao  
       2015-07-25 13:29:07 +08:00
    如果讲语义的话,vertical-align: text-middle 更合适
    sneezry
        4
    sneezry  
    OP
       2015-07-25 13:38:33 +08:00 via iPhone
    @ZoomZhao 目前的middle倒是更像文字中部,哈哈。看来想玩父系元素居中,妥妥地直接用定位吧
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   915 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 20:15 · PVG 04:15 · LAX 12:15 · JFK 15:15
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.