• 弹性容器----六大属性(5、项目在交叉轴上的对齐方式)


    弹性容器----六大属性(5、项目在交叉轴上的对齐方式)

    align-items属性定义项目在交叉轴(纵轴|侧轴)上如何对齐。 语法:

    .box {
     align-items: flex-start | flex-end | center | baseline | stretch;
    }

    它可能取5个值。具体的对齐方式与交叉轴的方向有关,下面假设交叉轴从上到下。

    • flex-start:交叉轴的起点对齐。

    • flex-end:交叉轴的终点对齐。

    • center:交叉轴的中点对齐。

    • baseline: 项目的第一行文字的基线对齐。

    • stretch(默认值):如果项目未设置高度或设为auto,将占满整个容器的高度。

    注意:你使用align-items:stretch;的大前提是 弹性项目没有高度或者弹性项目的高度是auto。

     项目在交叉轴上的对齐方式
        
    
    
        
            1---小李子
            2---是憨憨
            3
        4
        5
        6     

  • 相关阅读:
    NodeRed Modbus学习一(配置Modsim32)
    【测试】1. 概念 + 基础篇
    map中插入数据
    如何获取obs视频帧的二进制数据
    这 6 款在线 PDF 转换工具,得试
    【网络工程师笔记】——ACL
    js中map和set的区别
    Qt ListItem添加右键菜单
    87个分数线超400的的逆天专业有哪些?今年会是什么情况?
    C++ 核心指南之资源管理(下)智能指针最佳实践
  • 原文地址:https://blog.csdn.net/weixin_72303943/article/details/126316444