html5CSS3期末考试试题.pptx

html5CSS3期末考试试题演讲人（创作者）：省院刀客特万

04/判断题（每题1分，共10分，正确填“√”，错误填“×”）03/多项选择题（每题3分，共15分，少选得1分，错选不得分）02/单项选择题（每题2分，共20分）01/考试说明06/代码实现题（每题8分，共16分）05/简答题（每题5分，共20分）08/评分标准07/综合应用题（19分）目录

01考试说明

考试基本信息考试形式：闭卷笔试（含代码书写题）2.考试时长：120分钟

3.总分：100分

命题范围与重点1.命题范围：HTML5语义化标签、CSS3新特性（选择器/盒模型/布局/动画/媒体查询）、HTML5API（本地存储/Canvas/视频音频）、响应式设计原理及实现。

2.重点考察：知识点理解深度、代码实践能力、综合应用场景分析。

02单项选择题（每题2分，共20分）

HTML5基础1.以下哪个标签是HTML5新增的语义化标签？（）

A.`div`B.`header`C.`span`D.`p`

CSS3选择器2.能匹配所有以“http”开头的href属性的超链接的选择器是？（）

A.`a[href^=http]`B.`a[href$=http]`C.`a[href=http]`D.`a[href~=http]`

CSS3布局3.以下哪个属性用于设置Flex容器中子元素的排列方向？（）

A.`flex-wrap`B.`justify-content`C.`flex-direction`D.`align-items`

HTML5API4.关于`localStorage`的描述，正确的是？（）

A.数据仅在当前会话有效B.存储容量通常为5MBC.数据会随HTTP请求发送到服务器D.不支持跨页面访问

响应式设计5.媒体查询中`@media(max-width:768px)`表示？（）

A.屏幕宽度大于768px时生效B.屏幕宽度小于等于768px时生效C.仅适用于打印设备D.仅适用于横向屏幕

03多项选择题（每题3分，共15分，少选得1分，错选不得分）

HTML5语义化1.以下属于HTML5语义化标签的有？（）

A.`section`B.`aside`C.`marquee`D.`figure`

CSS3盒模型2.关于`box-sizing`属性，正确的描述有？（）

A.默认值为`content-box`B.`border-box`表示宽高包含内边距和边框C.仅对块级元素生效D.可解决内边距导致容器溢出的问题

CSS3动画3.以下能触发CSS3动画的属性有？（）

A.`transition`B.`animation`C.`transform`D.`flex`

HTML5视频4.关于`video`标签，正确的使用方式有？（）

A.必须指定`controls`属性显示控制条B.可通过`source`标签添加多个格式的视频文件C.`autoplay`属性在部分浏览器中会被自动禁用D.支持`loop`属性实现循环播放

响应式图像5.以下可实现响应式图像的技术有？（）

A.`srcset`属性B.`picture`标签C.CSS的`background-size:cover`D.`width:100%`配合`max-width`

04判断题（每题1分，共10分，正确填“√”，错误填“×”）

HTML5特性1.`canvas`标签必须通过JavaScript绘制图形，无法直接在HTML中定义内容。（）

CSS3选择器2.`:nth-child(2n)`表示选择父元素的第2个子元素。（）

CSS3布局3.`display:grid`默认将子元素排列为一行。（）

HTML5存储4.`sessionStorage`的数据在浏览器关闭后仍然保留。（）

响应式设计5.媒体查询中`min-device-width`比`min-width`更适合检测视口宽度。（）

CSS3动画6.`transition`属性可同时定义多个属性的过渡效果。（）

语义化7.为了提升SEO，应尽可能多用`div`包裹内容。（）

视频音频8.`audio`标签不支持自定义控制条样式。（）

盒模型9.`margin:auto`在Flex容器中可实现子元素的水平垂直居中。（）

新API10.`GeolocationAPI`可直接获取用户的精确IP地址。（）

05简答题（每题5分，共20分）

HTML5语义化1.简述HTML5语义化标签的作用及常见标签（至少列举3个）。

CSS