1.控制轴方向的方法
display: flex;默认沿着X轴排列
如何方块堆满容器大于容器宽度。会自动压缩

属性值:4个
1:flex-direction: row 默认主轴从左到右,左起点
2:flex-direction: row-reveres 默认主轴从右向左,右起点
3:flex-direction:column 默认纵轴(Y轴),从上到下

4:flex-direction:column-reverse 默认纵轴(Y轴),从下到上

总结:flex-direction 控制轴的四个属性值
左起 row(因为display:flex默认就是row所以不用这个)
右起 row-reverse
上起 column
下起 column-reverse
2.控制换行的方法
1.flex-wrap :nowrap 不换行 下图方块都挤一起去了,默认不换行,写不写都行

2.flex-wrap : wrap 地球通用换行,挤不下就下去,从左到右排

4.flex-wrap :wrap-reverse 向上换行排列
3.元素在主轴的对齐方式

justify-content:flex-end; 右对齐
注意!刚学的同学可能分不清这个和flex-direction:row-reverse和justify-content:end区别在哪。看下图!flex-direction:row-reverse是1在最右

居中对齐justify-content:center

两端对齐
justify-content:space-around:每个项目两侧的间隔相等。所以,项目之间的间隔比项目与边框的间隔大一倍。
网友回复
seedance2如何根据一张九宫格分镜头图片生成ai视频短剧?
www.gstatic.com打开报错net::ERR_TUNNEL_CONNECTION_FAILED
果蝇大脑神经在计算机中复原意味人脑神经和意识也可在计算机中复原?
cosyvoice-v3.5声音克隆报错:Error during speech synthesis: start speech synthesizer failed within 5s.
html如何实现二进制程序转成汇编代码?
python如何通过音色描述和说话内容生成语音?
python如何通过api调用Seedance 2.0 模型生成视频?
如何使用grok imagine免费生成10分钟ai短片?
ai能破解exe文件重写源代码吗?
浏览器除了于Chromium内核还有其他的不用于Chromium内核的浏览器吗?


