发表于： 2021-03-22 23:47:00
1 917
今天完成的事情：
复习之前任务的知识点
学习flex 弹性布局
弹性盒子是 CSS3 的一种新的布局模式。
CSS3 弹性盒（ Flexible Box 或 flexbox），是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。
引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间
弹性盒子由弹性容器(Flex container)和弹性子元素(Flex item)组成。
弹性容器通过设置 display 属性的值为 flex 或 inline-flex将其定义为弹性容器。
弹性容器内包含了一个或多个弹性子元素。
注意： 弹性容器外及弹性子元素内是正常渲染的。弹性盒子只定义了弹性子元素如何在弹性容器内布局。
弹性子元素通常在弹性盒子内一行显示。默认情况每个容器只有一行。
以下元素展示了弹性子元素在一行内显示，从左到右:
下面两个按钮不在同一行
继续学习弹性盒子，还不是很会用
明天计划的事： 早上写之前任务的总结，继续任务5
遇到的问题：
去掉背景色切下来的图放到头部
不知道为啥会变成白色，之前任务3的时候也是这样切，没有发生过这种情况
直接不用图片，使用CSS写出来
收获：初步了解 弹性盒子
返回列表
评论