CSS align-items 属性

css align-items 属性定义 flex 子项在 flex 容器的当前行的侧轴(纵轴)方向上的对齐方式

使用每个弹性对象元素的 align-self 属性可重写 align-items 属性

默认值:stretch
继承:
可动画化:
版本:CSS3
JavaScript 语法object.style.alignItems="center" 

CSS 语法

align-items: stretch|center|flex-start|flex-end|baseline|initial|inherit;


属性值

描述
stretch默认值。项目被拉伸以适应容器
center项目位于容器的中心
flex-start项目位于容器的开头
flex-end项目位于容器的结尾
baseline项目位于容器的基线上
initial设置该属性为它的默认值
inherit从父元素继承该属性

浏览器支持

下表中的数字表示支持该属性的第一个浏览器的版本号

紧跟在 -webkit-, -ms- 或 -moz- 后的数字为支持该前缀属性的第一个版本

属性Chrome  IEFirefox  SafariOpera  
align-items21.011.020.09.0
7.0 -webkit-
12.1

范例

居中对齐弹性盒的各项 <div> 元素

div {
    display: flex;align-items:center;
}

本文内容仅供个人学习/研究/参考使用,不构成任何决策建议或专业指导。分享/转载时请标明原文来源,同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦~感谢您的理解与支持!

链接: https://fly63.com/course/6_263

目录选择