CSS vertical-align属性

  • 定义和用法

    vertical-align属性设置元素的垂直对齐方式。
    特征 说明
    默认值 baseline
    继承 没有
    动画 有。CSS动画参考
    CSS版本 CSS1
    JavaScript语法 object.style.verticalAlign="top"尝试一下
  • 浏览器支持

    表中的数字指定了完全支持该属性的第一个浏览器版本。数字后跟-ms-, -webkit-,-moz-或-o-指定使用前缀的第一个版本。
    属性 IE/Edge Chrome FireFox Safari Opera
    属性名称
    vertical-align
    4.0
    1.0
    1.0
    1.0
    4.0
  • CSS语法

    vertical-align: baseline|length|sub|super|top|text-top|middle|bottom|text-bottom|initial|inherit;
  • 实例

    垂直对齐图像:
    img.a {
      vertical-align: baseline;
    }
    
    img.b {
      vertical-align: text-top;
    }
    
    img.c {
      vertical-align: text-bottom;
    }
    
    img.d {
      vertical-align: sub;
    }
    
    img.e {
      vertical-align: super;
    }
    
    尝试一下
  • 属性值

    属性值 描述
    baseline 元素与父元素的基线对齐。 这是默认的
    length 按指定长度升高或降低元素。 允许负值。 阅读长度单位
    % 以“行高”属性的百分比升高或降低元素。 允许负值
    sub 元素与父元素的下标基线对齐
    super 元素与父元素的上标基线对齐
    top 元素与线上最高元素的顶部对齐
    text-top 元素与父元素字体的顶部对齐
    middle 元素放在父元素的中间
    bottom 元素与行上的最低元素对齐
    text-bottom 元素与父元素字体的底部对齐
    initial 将此属性设置为其默认值。查看initial关键字
    inherit 从其父元素继承此属性。查看inherit关键字
  • 相关页面

    HTML教程:HTML样式
    CSS教程:CSS文本