这是我参与「第五届青训营 」伴学笔记创作活动的第 13 天。
justify-content控制 flex 项在主轴上的位置。
- 默认值是
flex-start，这会使所有 flex 项都位于主轴的开始处。 - 也可以用
flex-end来让 flex 项到结尾处。 center在justify-content里也是可用的，可以让 flex 项在主轴居中。- 上面用到的值
space-around是很有用的——它会使所有 flex 项沿着主轴均匀地分布，在任意一端都会留有一点空间。 -
space-between，它和space-around非常相似，只是它不会在两端留下任何空间。
flex 项排序
- 所有 flex 项默认的
order值是 0。 - order 值大的 flex 项比 order 值小的在显示顺序中更靠后。
- 相同 order 值的 flex 项按源顺序显示。
- 第三个元素显示在第二个后面是因为它们的 order 值一样，且第三个元素在源顺序中排在第二个后面。
grid-template-areas属性的使用规则如下：
- 需要填满网格的每个格子
- 对于某个横跨多个格子的元素，重复写上那个元素
grid-area属性定义的区域名字 - 所有名字只能出现在一个连续的区域，不能在不同的位置出现
- 一个连续的区域必须是一个矩形
- 使用
.符号，让一个格子留空
clear 属性接受下列值：
left：停止任何活动的左浮动right：停止任何活动的右浮动both：停止任何活动的左右浮动
给多列增加样式
- 使用
column-gap改变列间间隙。 - 使用
column-rule在列间加入一条分割线。 initial-scale：设定了页面的初始缩放，我们设定为 1。height：特别为视口设定一个高度。minimum-scale：设定最小缩放级别。maximum-scale：设定最大缩放级别。user-scalable：如果设为no的话阻止缩放。
个人学习总结：巩固了CSS基础知识，加强了记忆。
