前端期末考试试题及参考答案(07)

Posted 2023-01-04 谷哥的小弟

---

版权声明

• 本文原创作者：谷哥的小弟
• 作者博客地址：http://blog.csdn.net/lfdfhl

---

一、 填空题

1. display属性用于指定元素容器的类型，其默认值为______。
2. ______用于设置初始缩放比例，取值为0~10.0。
3. 在配置视口属性时，user-scalable用于设置用户是否可以缩放，默认为______。
4. 媒体查询由______和______组成。
5. ______就是用固定的格子进行网页布局，是一种清晰、工整的设计风格。

二、 判断题

1. 对于网页设计来说，栅格系统的使用可以让网页的信息呈现更加美观易读。（ ）
2. 任何时候都要应用百分比布局，它已经完全替代了固定布局。（ ）
3. 在媒体查询的条件表达式中，min-前缀表示小于。（ ）
4. 使用了媒体查询的页面，当重置浏览器大小的过程中，页面也会根据浏览器的宽度和高度重新渲染页面。（ ）
5. device-width表示视窗视口和可见视口宽度相同。（ ）

三、 选择题

1. 下列选项中，弹性盒布局属于哪项技术的内容（ ）。
   A. html B. CSS2 C. javascript D. CSS3
2. 下列选项中，在配置视口属性时用于设置最小缩放比例的选项为（ ）。
   A. initial-scale B. device-width C. user-scalable D. minimum-scale
3. 下列选项中，关于栅格系统的说法，错误的是（ ）。
   A. 栅格系统是一种响应式设计的实现方式
   B. 栅格系统是一个用于响应式设计的组件
   C. 对于前端开发来说，栅格系统的使用能让网页更加灵活与规范
   D. 对于网页设计来说，栅格系统的使用可以让网页的信息呈现更加美观、易读
4. 弹性盒布局中，flex-direction的默认值为（ ）。
   A. row B. row-reverse C. column D. column-reverse
5. 下列选项中，属于弹性盒布局复合属性的是（ ）。
   A. order B. display C. flex D. align

四、 简答题

1. 请简述什么是视口，PC端是否存在视口。
2. 请简述什么是媒体查询及媒体查询在网页开发中的作用。

参考答案

一、 填空题

1. inline
2. initial-scale
3. yes
4. 媒体类型 条件表达式
5. 栅格系统

二、 判断题

1. 对
2. 错
3. 对
4. 对
5. 对

三、 选择题

1. D
2. D
3. B
4. A
5. C

四、 简答题

1. 请简述什么是视口，PC端是否存在视口。
   在移动端浏览器当中，存在着两种视口，一种是可见视口即设备大小，另一种是视窗视口即网页宽度。视口是针对移动端的概念，PC端不存在视口的概念。
2. 请简述什么是媒体查询及媒体查询在网页开发中的作用。
   媒体查询是向不同设备提供不同样式的一种不错方式，它为每种类型的用户提供了最佳的体验。作为CSS3规范的一部分，媒体查询扩展了media属性的角色。允许设计人员基于各种不同的设备属性（比如屏幕宽度、方向等）来确定目标样式。