首页 > 其他分享 >29 . 弹性盒子怎么实现全部右对齐

29 . 弹性盒子怎么实现全部右对齐

时间:2022-11-13 15:55:43浏览次数:57  
标签:flex 盒子 color 29 height background 对齐

使用场景 :一个父盒子,一个子盒子 ,父盒子设置display: flex;布局 , 在使用 flex-direction 改变元素的排列方向 ,最后使用align-items :end ;改变侧轴的对齐方式 ;

   <style>
      #fa {
        display: flex;
        /* 改变主轴和侧轴的方向 */
        /* 改变元素的排列方向 */
        flex-direction: column;
        /* 此时的侧轴是 x 轴 */
        align-items: end;
        width: 500px;
        height: 500px;
        background-color: red;
      }
      #fa div {
        width: 100px;
        height: 100px;
        background-color: yellow;
        border: 1px solid #000;
      }
    </style>

 

 

标签:flex,盒子,color,29,height,background,对齐
From: https://www.cnblogs.com/zhulongxu/p/16886093.html

相关文章

  • golang内存对齐的重要性
     结构体中字段类型的改变直接造成内存对齐结果的改变,是的占用内存空间也不一样packagemainimport( "fmt" "unsafe")funcmain(){ varxxstruct{ aboo......
  • 297个机器学习彩图知识点(4)
    导读本系列将持续更新20个机器学习的知识点,欢迎关注,获取更多学习资料。1.线性回归参数计算2.向前逐步选择法3.梯度下降4.梯度下降口诀5.梯度6.贪心算法......
  • 第二章第3节: 2020.04.29 智能互联网之核心技术实践篇【三】
                                                         ......
  • C温故补缺(九):字节对齐与排序
    字节对齐与排序字节对齐的原因与字节排序取自:VisualEther原文档下载:Gitee_packed_packet用于结构体中变量在内存中的对齐.如typedefstructtest_s{inti;......
  • 第六章29
    【题目描述】小明所在的合唱队共有N 个人(N为奇数)。为了准备一次演出,老师开始为他们安排合唱队形了。大家都知道,合唱队形通常是中间高两端低的。老师是这样安排他们的队形......
  • VBA代码自动缩进排版 VBA代码对齐排版工具
    VBA代码助手下载地址视频演示空白区双击Tab键对当前过程排版代码区右键菜单对齐排版可关闭双击Tab自动排版VBA代码助手下载地址......
  • MySQL启动报错[ERROR] InnoDB: Trying to access page number 4294967295 in space 0,
    这篇文章是原来的《记一次mysql故障处理》,但是随着mysql问题越来越多,我感觉还是集合到一篇里面比较好,也方便之后问题复现的查找一、记一次mysql故障处理最近遇到的问......
  • Flex弹性盒子
    ......
  • day29 git
     概述:git是一个版本管理工具,是用于管理项目的版本的,它是一个分布式的项目管理工具(支持多分支,不区分客户端服务端),每个本地的代码都是一个本地的仓库......
  • day29 git讲解
    概述:git是一个版本管理工具。用于管理对应的项目的版本。git是一个分布式的项目管理工具,我每个本地的代码都是一个本地的仓库,然后最终提交到远程仓库(git是一个多分支的版......