Flex 布局基础知识测验

Flex 布局是以下哪种类型的布局模型？（ ）

• 表格布局模型

• 流布局模型

• 弹性布局模型

• 层布局模型

在 HTML5 中，要启用 Flex 布局，需要在容器元素上设置什么属性？（ ）

• display: flex;

• float: flex;

• position: flex;

• overflow: flex;

Flex 容器的主轴方向默认是（ ）。

• 水平方向（从左到右）

• 水平方向（从右到左）

• 垂直方向（从上到下）

• 垂直方向（从下到上）

如果想要改变 Flex 容器的主轴方向为垂直方向（从上到下），应该设置（ ）。

• flex - direction: column;

• flex - direction: row - reverse;

• flex - direction: column - reverse;

• flex - direction: vertical;

对于align - items属性，以下哪个选项不是其合法的值？（ ）

• flex - start

• center

• space - around

• stretch

justify - content属性用于（ ）。

• 在交叉轴上对齐项目

• 在主轴上对齐和分配项目之间的空间

• 定义项目的大小

• 定义项目的排列顺序

当设置align - self: flex - end;时，对哪个元素起作用？（ ）。

• Flex 容器的所有子元素

• 仅设置了该属性的 Flex 项目

• Flex 容器本身

• 相邻的 Flex 项目

如果想要实现 Flex 项目在主轴上均匀分布，并且两端对齐，应该设置justify - content为（ ）。

• space - between

• space - around

• flex - end

• center

以下哪种情况会导致 Flex 项目换行？（ ）

• 设置flex - wrap: nowrap;并且容器空间足够

• 设置flex - wrap: wrap;并且容器空间不足

• 设置flex - direction: column;

• 设置align - items: stretch;

对于多个 Flex 项目，如何设置它们的排列顺序？（ ）

• 使用z - index属性

• 使用order属性

• 使用index属性

• 使用position属性