共计 554 个字符,预计需要花费 2 分钟才能阅读完成。
css 中弹性盒子
display:flex; 实现了真正的弹性盒子;
flex-direction: 弹性盒子的排列形式;
row: 从左到右;
row-reverse: 从右向左;
column: 从上往下;
column-reverse:从下往上;
flex-warp:设置我的项目的换行形式;
warp:超出一行主动换行;
nowarp:不换行,自适应;
warp-reverse:将内容颠倒换行;
justify-content: 内容的对齐形式;
flex-start:内容靠左对齐;
flex-end:内容向右对齐;
center:内容居中对齐;
space-between:两端对齐,两端固定值,两头平分;
space-around:两端居中对齐,每个 div 两端成果都是一样的;
align-items: 容器内额定空间的解决
flex-start: 向右对齐;
flex-end:向左对齐;
flex-center:居中对齐;
base-line:成果同 flex-start;
stratch: 默认成果;
flex:让容器按比例调配
值:间接写数字
例如:
flex:2;意思是一行排只能排两个元素;
order:排序;
值:数字
例如:
order:2;意思就是这个标签显示进去的程序
// 本期的教程到了这里就完结啦, 是不是很简略! 是不是很棒! 让咱们一起致力走向巅峰!
正文完