(完整版)《CSS样式》习题答案

千里之行，始于足下让知识带有温度。第第2页/共2页精品文档推荐(完整版)《CSS样式》习题答案、挑选题

1.CSS是（C）的缩写。

A.ColorfulStyleSheets

B.ComputerStyleSheets

C.CascadingStyleSheets

D.CreativeStyleSheets

2.引用外部样式表的格式是（B）。

A.

B.

C.mystyle.css

3.引用外部样式表的元素应当放在.（C）。

A.HTML文档的开头的位置

B.HTML文档的结束的位置

C.在head元素中

D.在body元素中

4.内部样式表的元素是（A）。

A.

B.

C.

5.元素中定义样式表的属性名是（A）o

A.style

B.class

C.styles

D.font

6.下列—（C）是定义样式表的正确格式。

A.{body:color=black（body}

B.body:color=black

C.body{color:black}

D.{body;color:black}

7.下列—（A）是定义样式表中的解释语句。

A./*解释语句*/

B.//解释语句

C.//解释语句//

D.'解释语句

8．假如要在不同的网页中应用相同的样式表定义，应当（C）A．直接在HTML的元素中定义样式表

B.在HTML的#记中定义样式表

C．通过一个外部样式表文件定义样式表

D.以上都可以

9.样式表定义#title{color:red}表示（B）。

A.网页中的标题是红色的

B.网页中某一个id为title的元素中的内容是红色的

C.网页中元素名为title的内容是红色的

D.以上随意一个都可以

10.样式表定义.outer{background-color:yellow}表示（B）。

A.网页中某一个id为outer的元素的背景色是红色的

B.网页中含有class=”outer”元素的背景色是红色的

C.网页中元素名为outer元素的背景色是红色的

D．以上随意一个都可以

47.光标移动文本框上方时，文本框边框的色彩就转变，这是由于激发了下列的

（C）大事。

A.onFocus

B.onMouseUp

C.onMousrOver

D.onMousMOve

48.下列属性哪一个能够实现层的躲藏？（C）

A.display:false

B.display:hidden

C.display:none

D.display:""

49.下列选项中，不属于文本属性的是（D）。

A.font-size

B.font-style

C.text-align

D.font-color

50.页面上有一个按钮btn,同时定义好了一个类样式（按钮图片样式表btnPic）,那么使用（B）就可以实现背景图片的转变。

A.onMouseOver="className=btnPic"

B.onMouseOver="this.className=btnPic"

C.onMouseOver="this.style.className=btnPic"

D.this.btn.style.className="btnPic"

二、简答题

1、什么是标记挑选器并举例说明。

CSS标记挑选器就是声明哪些标记采纳哪种CSS样式。

例如：h1{color:red;font-size:25px;}

2、什么是类别挑选器并举例说明。

类别挑选器的名字可以由用户自定义，用做html页面某标签的class属性值。

例如：.red{color:red;font-size:18px}

3、什么是ID挑选器并举例说明。

ID挑选器是针对html页面中某个具有此ID属性的标签设置的CSS样式。

例如：#bold{font-weight:bold;}

4、举例说明什么是行内式CSS样式。

行内式是直接对html的标记使用style属性，然后将CSS代码直接写在其中。

例如：＜pstyle=”color:#ff0000;font-size:20px＞正文内容v/p＞

5、举例说明什么是内嵌式CSS样式。

内嵌样式表就是将CSS写在＜head＞与＜/head＞之间，并且用＜style＞和v/style＞标记举行声明。

例如：vhead＞vstyletype=”text/css”＞

p{color:#0000ff}

v/style＞v/head＞

6、举例说明什么是链接式CSS样式。

链接式CSS样式表是通过使用html链接文件标签link将外部CSS应用到本页面的样式使用办法。

例如：

7、举例说明什么是导入式CSS样式。

采纳import方式导入的样式表，在html文件初始化时，会被导入到html文件内，

作为文件的一部分，类似内嵌式的效果。

例如：@importurl（sheet.css）;

8、什么是交集挑选器，并举例说明。

交集挑选器是由两个挑选器直接衔接构成，其结果是选中二者各自元素范围的交集。其中第1个必需是标记挑选器，第2个必需是类别挑选器或者ID挑选器。例如：p.special{color:red}

9、什么是并集挑选器，并举例说明。

并集挑选器或者称为“集体声明”，它的结果是同时选中各个基本挑选器所挑选的范围。

例如：h1,h2,p{color:purple;font-size:15px}

10、什么是后代挑选器，并举例说明。

后代挑选器的写法就是把外层的挑选器名字写在前面，内层的挑选器名字写在后面，之间用空格分隔。例如：pspan{color:red}

11、在CSS中一个自立的盒子模型有哪几部分组成？

content（内容）、border（边框）、padding（内边距）和margin（外边距）

12、举例说明什么是块级元素和行内元素？

块级元素总是占领一个矩型区域，并且同级兄弟块依次竖直罗列，左右撑满。例如：

行内元素不占有自立的区域，并且同级元素之间横向罗列，到最右端自动这行。例如：

13、解释一下div标签的作用

＜div＞是一个区块容器标记，即＜div＞与＜/div＞之间相当于一个容器，可以容纳段落、标题、表格、图片等各种html元素。

14、解释一下span标签的作用

vspan＞标记和＜div＞一样，作为容器可以容纳各种html元素，但它是一个行内元素，在它的前后不会换行。

15、解释盒子模型的float属性。

float属性默认为none,也就是标准流通常的状况。假如将float属性的值设置为left或right，元素会向其父元素的左侧或右侧逼近，同时默认状况下，盒子的宽度不再舒展，而是收缩，按照盒子里面的内容的宽度来确定。

16、解释盒子模型的display属性。

display属性用于确定盒子的类型。display属性设为inline，即为“行内”；设为block，即为“块级”；设为none,即为“无”，也就是躲藏盒子。

17、圆角框主要有哪几种制作办法？两背景图像法、四图像不固定宽度圆角框、五图像二维滑动门圆角框。

18、使用CSS主要有哪几种布局方式？两列布局、三列布局、多列布局。

19、CSS布局办法与表格布局办法相比，有哪些优势？

（1）页面载入更快；（2）降低网站流量费用；（3）易于修改；

（4）视觉全都（5）更易于被搜寻引擎找到。

20、使用CSS布局的网页应实现哪些要求？

（1）宽度使用多列布局，并保证页头和页脚正确显示；

（2）可以指定列宽度固定，其余列宽度自适应；

（3）在html中，个列可以随意挨次罗列，终于效果都正确显示

三、案例分析题

1、解释以下CSS样式的含义。table{

border:1px#333solid;

font:12pxarial;

width:500px

}

td,th{

padding:5px;

border:2pxsolid#EEE;

border-bottom-color:#666;

border-right-color:#666;

}

将表格边框宽度设为1px，色彩设为#333,边框为实线；表格中的字体大小设为

12px,字体类型为arial;表格宽度为500px。

设置单元格和表头部分的样式：内边距为5px，边框宽度2px，实线，色彩为#EEE,底部和右侧边框色彩特殊设为#666

2、解释以下CSS样式的含义。

form{

border:1pxdotted#AAAAAA;

padding:3px6px3px6px;

margin:0px;

font:14pxArial;

}

select{

width:80px;

background-color:#ADD8E6;

}

设置表单边框宽度为1px，点划线，色彩为#AAAAAA，内上、右、下、左边距分离为：3px6px3px6px，外边距为0px，字体为14px大小的Arial字体。

设置挑选框宽度为80px，背景色彩为#ADD8E6

3、解释以下CSS样式的含义。

input{

color:#00008B;

input.btn{

background-color:#ADD8E6;

padding:1px2px1px2px;

}

设置input标签中字体色彩为#00008B;

input标签中id属性为btn的按钮背景色彩设为#ADD8E6，内上、右、下、左边

距分离设为1px、2px、1px、2px

4、解释以下CSS样式的含义。

.rounded{

background:url(images-notebook/left-top.gif)topleftno-repeat;

}

.roundedh2{

background:url(images-notebook/right-top.gif)toprightno-repeat;

padding:20px20px10px;

margin:0;

}

定义类挑选器.rounded：背景图像为left-top.gif，从左上角开头，不平铺

定义后代挑选器.roundedh2背景图像为right-top.gif，从右上角开头，不平铺;

内上、左右、下边距分离是20px20px10px，外边距为0

5、画出一个1-((1-2)+1)-1的布局结构暗示图。

6、画出一个1-((1+(3-1-2))-1的布局结构暗示图

7、解释以下CSS样式的含义。

#header,#pagefooter,#container{

margin:0auto;

width:85%;

}

#content{