《HTML5+CSS3网站设计基础教程》_第1页
《HTML5+CSS3网站设计基础教程》_第2页
《HTML5+CSS3网站设计基础教程》_第3页
《HTML5+CSS3网站设计基础教程》_第4页
《HTML5+CSS3网站设计基础教程》_第5页
已阅读5页,还剩4页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

《《HTML5+CSS3网站设计基础教程》》试卷总分题型单选题多选题填空题简答题题分得分得分单选题(每题2分,共计30分)页面上的div标签,其HTML代码为<divid="box"style="color:red">文字</div>,为其设置CSS样式如下:

#box{

color:blue;

}

那么,文字的颜色将显示为()

A、红色

B、蓝色

C、黑色

D、以上选项都不正确

下列选项中,能够让元素倾斜显示的变形函数是()。

A、translate()方法

B、scale()方法

C、skew()方法

D、rotate()方法

下面的选项中,id选择器的基本语法格式正确的是()

A、.#id名{属性值1;属性值2;属性值3;}

B、#id名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}

C、#id名{属性1:属性值1,属性2:属性值2,属性3:属性值3}

D、#id名{属性1:“属性值1”;属性2:“属性值2”;属性3:“属性值3”;}

下列样式代码中,可实现元素的溢出内容被修剪,且被修剪的内容不可见的是()。

A、overflow:visible;

B、overflow:hidden;

C、overflow:auto;

D、overflow:scroll;

下列选项中,用于更改元素左内边距的是()。

A、text-indent

B、padding-left

C、margin-left

D、padding-right

页面上的div标签,其HTML结构如下:

<divid="father">

<pclass="son">传智播客</p>

</div>

对应的CSS样式代码如下:

#father#son{

color:red;

}

#fatherp{

color:blue;

}

div.son{

color:yellow;

}

divp{

color:green;

}

那么,文字的颜色将显示为()

A、红色

B、蓝色

C、黄色

D、绿色

<span>标记是网页布局中常见的标记,其显示类型为()。

A、块级类型

B、行内类型

C、行内块类型

D、浮动类型

在网页中插入图像,若图像文件位于html文件的上两级文件夹,则在文件名之前加入()

A、../

B、/

C、./

D、../../

下列选项中,属于animation-timing-function默认属性值的是()。

A、ease

B、ease-in

C、ease-out

D、linear

关于行内式引入CSS样式表,以下书写正确的是()

A、<pstyle=font-size:12px;color:red;>段落文本</p>

B、<pstyle="font-size:12px,color:red;">段落文本</p>

C、<pstyle="font-size:12px;color:red;">段落文本</p>

D、<pstyle="font:12px;color:red;">段落文本</p>

<form>与</form>之间的表单控件是由用户自定义的。下列选项中,不属于表单标记<form>常用属性的是()。

A、action

B、size

C、method

D、name

在CSS中,提供了字体样式属性来控制网页中的字体。下面的字体样式设置正确的是()。

A、{font-family:黑体;}

B、{font-family:“黑体”;}

C、{fontFamily:“黑体”;}

D、{font-Family:“黑体”;}

下列选项中,用于改变盒子模型外边距的是()。

A、margin

B、padding

C、type

D、border

HTML5中()元素可替代<divid=“footer”></div>标记来定义页面底部。

A、nav

B、header

C、aside

D、footer

下列选项中,用于规定过渡效果何时开始的属性是()。

A、transition-property属性

B、transition-duration属性

C、transition-timing-function属性

D、transition-delay属性

得分多选题(每题2分,共计10分)下面的选项中,CSS样式书写正确的是()

A、p{font-size:12px;color:red;}

B、p{font-size=12px;color=red}

C、p{font-size:12px;}

D、p{font-size:12;color:red;}

下列选项中,属于定义有序列表相关属性的是()

A、background

B、type

C、start

D、value

关于建立站点的作用,下列说法正确的是()

A、可以形成明晰的站点组织结构图。

B、方便增减站内文件夹及文档。

C、可以系统化地管理网站文件。

D、对于网站本身的上传维护,内容的扩充和移植都有着重要的影响。

关于元素的相对定位模式,下列说法正确的是()。

A、相对定位是将元素相对于他在标准文档流中的位置进行定位

B、当position属性的取值为absolute时,可以将元素定位于相对位置

C、可通过边偏移属性改变相对定位元素的位置

D、应用相对定位后,元素在文档流中的位置将消失

overflow属性用于规范溢出内容的显示方式,下列选项中属于overflow常用属性值的是()。

A、visible

B、hidden

C、auto

D、scroll

得分填空题(每题2分,共计20分)内嵌式是将CSS代码集中写在HTML文档的【】标记中,并且用【】标记定义。

在CSS中,设置h2标记字号为16像素且显示红色字体的代码为【】。

HTML5中,调用网络视频文件的方法和调用音频文件方法类似,也需要获取相关视频文件的【】地址。

在CSS中,用于设置行间距的属性是【】,一般称为行高。

HTML5中,【】元素通常使用多个section元素进行划分。

在CSS中,用于定义字体风格,如设置斜体、倾斜或正常字体的属性是【】。

在HTML中,一个完整的表单通常由表单控件、提示信息和【】三部分构成。

为页面上的p标签:<pid="para1"class="special”></p>添加内嵌式CSS样式,可以使用的选择器有p、#para1以及【】。

CSS3中,E[att^=value]属性选择器是指选择名称为E的标记,且该标记定义了att属性,att属性值包含【】为value的子字符串。

在HTML5中,video元素的【】属性用于当视频结束时重新开始播放。

得分简答题(每题8分,共计40分)完成下图所示的页面,请使用::before选择器添加下图中的红色标题,字体大小20px,微软雅黑字体。

请阅读下面的代码,并按照要求作答。

HTML中的代码如下:

<h3>传智播客</h3>

<ul>

<li>北京传智播客</li>

<li>上海传智播客</li>

<li>广州传智播客</li>

</ul>

使用内嵌式CSS样式,对应代码如下:

<styletype="text/css">

li:nth-child(2){color:red;}

</style>

认真分析以上代码,写出哪些文字的颜色会变为红色?

制作一个如下图所示的页面,要求:

(1)使用内嵌式引入CSS样式表。

(2)分别为页面元素定义不同的类。

(3)通过控制不同的类,分别为第一个字母“G”设置为蓝色、加粗、60px字体;

第二个字母“o”设置为红色、加粗、60px字体;

第三个字母“o”设置为黄色、加粗、60px字体;

第四个字母“g”设置为蓝色、加粗、60px字体;

剩余字母“le”按默认样式输出。

简要描述CSS3中的box-sizing属性的取值及取值的含义。

在HTML5中,source元素包含哪些属性?

答案单选题(每题2分,共计30分)A

C

B

B

B

A

B

D

A

C

B

B

A

D

D

多选题(每题2分,共计10分)A,C

B,C,D

A,B,C,D

A,C

A,B,C,D

填空题(每题2分,共计20分)【<head>】【<style>】

【h2{font-size:16px;color:red;}】

【URL】

【line-height】

【article】

【font-style】

【表单域】

【.special】

【前缀】

【loop】

简答题(每题8分,共计40分)正确答案:1<!doctypehtml>

2<html>

3<head>

4<metacharset="utf-8">

5<title>添加文字内容</title>

6<styletype="text/css">

7ul:before{

8content:"球类";

9color:red;

10font-size:20px;

11font-family:"微软雅黑";

12}

13</style>

14</head>

15<body>

16<ul>

17<li>篮球</li>

18<li>乒乓球</li>

19<li>羽毛球</li>

20</ul>

21</body>

22</html>

正确答案:上海传智播客

正确答案:1<!doctypehtml>

2<html>

3<head>

4<metacharset="utf-8">

5<title>无标题文档</title>

6<title>google</title>

7<styletype="text/css">

8.g{color:#176CEE;font-size:60px;font-weight:bold;}

9.o{color:#D4412D;font-size:60px;font-weight:bold;}

10.oo{color:#FFB404;font-size:60px;font-weight:bold;}

11</style>

12</head>

13<body>

14<spanclass="g">G</span>

15<spanclass="o">o</span>

16<spanclass="oo">o</span>

17<spanclass="g">g</span>le

18</body>

19</html>

正确答案:box-sizing属性

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论