css中align—items的属性 CSS align-items 属性

css中align—items的属性

align-items 属性是 Flexbox 布局模型中的一个重要属性，它用于设置或检索弹性盒子元素在侧轴（纵轴）方向上的对齐方式。

.container {
    display: flex;
    align-items: center;  
}

align-items 属性可以使用 6 个不同的值来定义弹性盒子元素在侧轴方向上的对齐方式，分别是 flex-start、flex-end、center、baseline、stretch 以及 inherit。

 
.container {     
    display: flex;  
    align-items: flex-start;     
}  

flex-start 将所有子元素沿着侧轴顶端对齐；flex-end 将所有子元素沿着侧轴底端对齐；center 将所有子元素沿着侧轴居中对齐；baseline 将所有单行文本的基线对准。

  .container {     
    display: flex;  
    align-items: stretch;      } 

stretch 拉伸以适应容器；inherit 继承定义于包含该元素的定义。当使用 stretch 时，如果存在 min-width/min-height 时将不会生效。

CSS align-items 属性

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