响应式Web设计单元测试

响应式Web设计单元测试

一. 单选题 （共8题，40.0分）

1. (单选题, 5.0分) 用于配置视口属性的标签是（ ）。A <meta> B <title> C <link> D <script>
2. (单选题, 5.0分) 配置视口时，元数据标签的name属性值应为（ ）。 A view B view portC viewport D view-port
3. (单选题, 5.0分) 将固定布局转化为百分比布局的换算公式正确的是（ ）。 A 目标元素宽度/子盒子宽度=百分数宽度B 目标元素宽度/父盒子宽度=百分数宽度 C 父盒子宽度/目标元素宽度=百分数宽度 D 目标元素宽度/网页宽度=百分数宽度
4. (单选题, 5.0分) 用于指定元素为弹性盒容器的属性是（ ）。 A flexB display C order D align
5. (单选题, 5.0分) 下列不属于flex-wrap属性值的项有（ ）。 A nowrap B wrap C wrap-reverseD center
6. (单选题, 5.0分) 设置弹性元素扩展比率为0、收缩比率为1和宽度居中的缩写形式为（ ）。 A flex: 1 0 auto;B flex: 0 1 auto; C flex: 0, 1, auto; D flex: 1, 0, auto;
7. (单选题, 5.0分) 用于设置子元素出现顺序的属性是（ ）。 A display B flexC order D align-self
8. (单选题, 5.0分) 设置子元素如何在当前轴方向排列的属性为（ ）。 A flex-wrap B align-items C justify-contentD flex-direction

二. 多选题 （共5题，25.0分）

1. (多选题, 5.0分) 视口是针对移动端浏览器的，通常分为（ ）。A 可见视口，即设备屏幕大小 B 隐藏视口C 视窗视口，即网页大小 D 固定视口
2. (多选题, 5.0分) 常见的响应式Web设计方式有（ ）。A 百分比布局B 栅格系统 C DIV布局D 弹性盒布局
3. (多选题, 5.0分) 关于弹性盒布局，下面叙述正确的是（ ）。A 弹性盒由容器、子元素和轴组成。 B 弹性盒改进了块模型，既不使用浮动，也不会在弹性盒容器与其内容之间合并外边距。 C 增加了盒状模型的灵活性。 D 在适应不同设备能力上不如栅格系统。
4. (多选题, 5.0分) 下列属于flex-direction属性的可取值的项有（ ）。A row B wrapC columnD row-reverse
5. (多选题, 5.0分) 在使用弹性盒布局时，以下描述正确的是（ ）。A 弹性容器的每一个子元素变为一个弹性子元素，弹性容器直接包含的文本变为匿名的弹性子元素。 B 多列布局中的column-*属性对弹性子元素无效。 C float属性和clear 属性对弹性子元素无效，使用float会导致display属性计算为block。 D vertical-align属性对弹性子元素的对齐无效。

三. 判断题 （共7题，35.0分）

1. (判断题, 5.0分) 媒体查询不可以根据视口宽度、设备方向等差异来改变页面的显示方式。 A 对B 错
2. (判断题, 5.0分) 媒体查询由媒体类型和条件表达式组成，用@media规则定义。A 对 B 错
3. (判断题, 5.0分) 在定义媒体查询时，媒体类型与条件表达式都不能省略。 A 对B 错
4. (判断题, 5.0分) 把固定像素的宽度换算为百分比宽度，可以将固定布局转化为百分比布局。A 对 B 错
5. (判断题, 5.0分) 栅格系统采用固定的格子进行网页布局，以适应不同设备。A 对 B 错
6. (判断题, 5.0分) 在弹性盒布局中，元素的排列顺序是由元素书写的顺序来决定的。 A 对B 错
7. (判断题, 5.0分) 要将子元素按自然书写顺序排列，则order属性都设置成同一个值。A 对 B 错