CSS复习题目资料.pdf

《CSS复习题目资料.pdf》由会员分享，可在线阅读，更多相关《CSS复习题目资料.pdf（23页珍藏版）》请在三一文库上搜索。

1、一、选择题 1CSS 是（）的缩写。 A Colorful Style Sheets B Computer Style Sheets C Cascading Style Sheets D Creative Style Sheets 2引用外部样式表的格式是（B） 。 A B C mystyle.css 3引用外部样式表的元素应该放在（） 。 A HTML 文档的开始的位置 B HTML 文档的结束的位置 C 在 head元素中 D 在 body 元素中 4内部样式表的元素是（） 。 A B C 5元素中定义样式表的属性名是（） 。 A style B class C styles D font

2、 6下列（）是定义样式表的正确格式。 A body:color=black(body B body:color=black C body color: black D body;color:black 7下列（）是定义样式表中的注释语句。 A /* 注释语句*/ B / 注释语句 C / 注释语句/ D 注释语句 8如果要在不同的网页中应用相同的样式表定义，应 该（） 。 A直接在 HTML 的元素中定义样式表 B在 HTML 的标记中定义样式表 C通过一个外部样式表文件定义样式表 D以上都可以 9样式表定义#title color:red 表示（） 。 A网页中的标题是红色的 B网页中某一个

3、id 为 title 的元素中的内容是红色的 C网页中元素名为title 的内容是红色的 D以上任意一个都可以 10样式表定义.outer background-color:yellow 表 示（） 。 A网页中某一个id 为 outer 的元素的背景色是红色的 B网页中含有class=” outer”元素的背景色是红色的 C网页中元素名为outer 元素的背景色是红色的 D以上任意一个都可以 11下列（）表示 p 元素中的字体是粗体。 A p text-size:bold B p font-weight:bold C D 12下列（）表示 a 元素中的内容没有下划线。 Aa text-dec

4、oration:no underline Ba underline:none Ca text-decoration:none Da decoration:no underline 13下列（A）表示上边框线宽10px，下边框线宽 5px，左边框线宽20px，右边框线宽1px， 。 A border-width:10px 1px 5px 20px B border-width:10px 5px 20px 1px C border-width:5px 20px 10px 1px D border-width:10px 20px 5px 1px 14下列（）表示左边距。 A margin-left

5、B margin C indent D text-indent 15设置外边距（）是负数。 A 可以 B 不可以 16下列（A）表示列表项符号是小方块。 A list-style-type: square B type: square C list-type: square D type: 2 17“样式表定义中的display 和 visibility效果是一样 的，都是用于网页指定对象的隐藏和显示”的说法是 （B ） 。 A正确的 B不正确的 18如果要将网页中的两个div 对象制作为重叠效果， （D ） 。 A是不可能的 B利用表格标记 C利用样式表定义中的绝对位置与相对位置属性 D利用

6、样式表定义中的z-index 属性 19.CSS 是利用什么HTML 标记构建网页布局？（） A. B. C. D. 20. 在CSS 语 言 中 下 列 哪 一 项 是 “ 左 边 框 “ 的 语 法 ？ （C ） A. border-left-width: B. border-top-width: C. border-left: D. border-top-width: 21.在 CSS 语言中下列哪一项的适用对象是“所有对象 “？ （A ） A. 背景附件 B. 文本排列 C. 纵向排列 D. 文本缩进 22.下列选项中不属于CSS 文本属性的是（D ） Afont-size Btext

7、-transform Ctext-align Dline-height 23.在 CSS 中不属于添加在当前页面的形式是（D ） A内联式样式表B嵌入式样式表 C层叠式样式表D链接式样式表 24.在 CSS 语言中下列哪一项是“列表样式图象“的语法？ （D） A. width: B. height: C. white-space: D. list-style-image: 25.下列哪一项是css正确的语法构成？（C ） A. body:color=black B. body;color:black C. body color: black; D. .body:color=black(body

8、 26.下面哪个 CSS 属性是用来更改背景颜色的？（A ） A. background-color: B. bgcolor: C. color: D. text: 27.怎样给所有的 标签添加背景颜色?（B ） A. .h1 background-color:#FFFFFF B. h1 background-color:#FFFFFF; C. h1.all background-color:#FFFFFF D. #h1 background-color:#FFFFFF 28. 下 列 哪 个css 属 性 可 以 更 改 样 式 表 的 字 体 颜 色 ？ （D ） A. text-colo

9、r= B. fgcolor: C. text-color: D. color: 29.下列哪个 css属性可以更改字体大小？（B ） A. text-size B. font-size C. text-style D. font-style 30.下 列 哪 段 代 码 能 够 定 义 所 有P 标 签 内 文 字 加 粗 ？ （D ） A. B. C. p text-size:bold D. p font-weight:bold 31.如何去掉文本超级链接的下划线？（D ） A. a text-decoration:no underline B. a underline:none C. a

10、decoration:no underline D. a text-decoration:none 32.如何设置英文首字母大写？（B ） A. text-transform:uppercase B. text-transform:capitalize C. 样式表做不到 D. text-decoration:none 33.下列哪个 css属性能够更改文本字体？（C ） A. f: B. font= C. font-family: D. text-decoration:none 34.下列哪个 css属性能够设置文本加粗？（A ） A. font-weight:bold B. style:b

11、old C. font:b D. font= 35.下列哪个 css属性能够设置盒模型的内补丁为10.20.30.40 （顺时针方向）？（A ） A. padding:10px 20px 30px 40px B. padding:10px 1px C. padding:5px 20px 10px D. padding:10px 36下 列 哪 个 属 性 能 够 设 置 盒 模 型 的 左 侧 外 补 丁 ？ （C ） A. margin: B. indent: C. margin-left: D. text-indent: 37. 定 义 盒 模 型 外 补 丁 的 时 候 是 否 可 以

12、使 用 负 值 ? （A ） A. 是 B. 否 38.如何能够定义列表的项目符号为实心矩形？（D ） A. list-type: square B. type: 2 C. type: square D. list-style-type: square 39. 在CSS 语 言 中 下 列 哪 些 选 项 是 背 景 图 像 的 属 性 （ABCD ） A 背景重复B 背景附件C 纵向排列 D 背景位置 40.CSS 中的选择器包括（BCD ） A超文本标记选择器B类选择器 C标签选择器DID 选择器 二、简答题 1、什么是标记选择器并举例说明。 CSS 标记选择器就是声明哪些标记采用哪种CS

13、S 样式。 例如： 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 代 码直接写在其中。 例如： 正文内容 5

14、、举例说明什么是内嵌式CSS 样式。 内嵌样式表就是将CSS 写在 与之间， 并且用 和标记进行声明。 例如： p color:#0000ff 6、举例说明什么是链接式CSS 样式。 链接式 CSS 样式表是通过使用html 链接文件标签link 将外 部 CSS 应用到本页面的样式使用方法。 例如： 7、举例说明什么是导入式CSS 样式。 采用 import 方式导入的样式表，在html 文件初始化时，会 被导入到 html 文件内， 作为文件的一部分，类似内嵌式的效 果。 例如： import url(sheet.css); 8、什么是交集选择器，并举例说明。 交集选择器是由两个选择器直接

15、连接构成，其结果是选中 二者各自元素范围的交集。其中第1 个必须是标记选择器， 第 2 个必须是类别选择器或者ID 选择器。 例如： p.special color:red 9、什么是并集选择器，并举例说明。 并集选择器或者称为“集体声明”，它的结果是同时选中各 个基本选择器所选择的范围。 例如：h1,h2,p color:purple; font-size:15px 10、什么是后代选择器，并举例说明。 后代选择器的写法就是把外层的选择器名字写在前面，内层 的 选 择 器 名 字 写 在 后 面 ， 之 间 用 空 格 分 隔 。 例 如 ： p span color:red 11、在 CS

16、S中一个独立的盒子模型有哪几部分组成？ content（内容）、border（边框）、padding（内边距） 和 margin （外边距） 12、举例说明什么是块级元素和行内元素？ 块级元素总是占据一个矩型区域，并且同级兄弟块依次竖直 排列，左右撑满。例如： 行内元素不占有独立的区域，并且同级元素之间横向排列， 到最右端自动这行。例如： 13、解释一下div 标签的作用 是一个区块容器标记，即 与 之间相当于一 个容器， 可以容纳段落、 标题、表格、图片等各种html 元素。 14、解释一下span 标签的作用 标记和 一样，作为容器可以容纳各种html 元素， 但它是一个行内元素，在它的前

17、后不会换行。 15、解释盒子模型的float 属性。 float 属性默认为none，也就是标准流通常的情况。如果将 float 属性的值设置为left 或 right，元素会向其父元素的左侧 或右侧靠近，同时默认情况下，盒子的宽度不再伸展，而是 收缩，根据盒子里面的内容的宽度来确定。 16、解释盒子模型的display 属性。 display 属性用于确定盒子的类型。display 属性设为inline ， 即为“行内”；设为block，即为“块级” ；设为none，即为 “无” ，也就是隐藏盒子。 17、圆角框主要有哪几种制作方法？ 两背景图像法、四图像不固定宽度圆角框、五图像二维滑动 门

18、圆角框。 18、使用 CSS 主要有哪几种布局方式？ 两列布局、三列布局、多列布局。 19、CSS布局方法与表格布局方法相比，有哪些优势？ （1）页面载入更快； （2）降低网站流量费用；（3）易于修 改； （4）视觉一致（ 5）更易于被搜索引擎找到。 20、使用 CSS 布局的网页应实现哪些要求？ （1）宽度使用多列布局，并保证页头和页脚正确显示； （2）可以指定列宽度固定，其余列宽度自适应； （3）在 html 中，个列可以任意顺序排列，最终效果都正确 显示。 三、案例分析题 1、解释以下CSS 样式的含义。 table border: 1px #333 solid; font: 12px

19、arial; width: 500px td,th padding: 5px; border: 2px solid #EEE; border-bottom-color: #666; border-right-color: #666; 将表格边框宽度设为1px，颜色设为 #333，边框为实线；表 格中的字体大小设为12px,字体类型为arial；表格宽度为 500px。 设置单元格和表头部分的样式：内边距为 5px， 边框宽度 2px， 实线，颜色为 #EEE，底部和右侧边框颜色特别设为#666 2、解释以下CSS 样式的含义。 form border:1px dotted #AAAAAA; p

20、adding:3px 6px 3px 6px; margin:0px; font:14px Arial; select width:80px; background-color:#ADD8E6; 设置表单边框宽度为1px，点划线，颜色为#AAAAAA，内 上、右、下、左边距分别为： 3px 6px 3px 6px ，外边距为 0px， 字体为 14px 大小的 Arial 字体。 设置选择框宽度为80px，背景颜色为 #ADD8E6 3、解释以下CSS 样式的含义。 input color:#00008B; input.btn background-color:#ADD8E6; padding

21、:1px 2px 1px 2px; 设置 input 标签中字体颜色为#00008B； input 标签中 id 属性为 btn 的按钮背景颜色设为#ADD8E6 ， 内上、右、下、左边距分别设为1px、2px、1px、2px 4、解释以下CSS 样式的含义。 .rounded background: url(images-notebook/left-top.gif) top left no-repeat; .rounded h2 background: url(images-notebook/right-top.gif) top right no-repeat; padding:20px 2

22、0px 10px; margin:0; 定义类选择器 .rounded：背景图像为left-top.gif ，从左上角开 始，不平铺 定义后代选择器.rounded h2：背景图像为right-top.gif ，从右 上角开始，不平铺；内上、左右、下边距分别是20px 20px 10px，外边距为0 5、画出一个1-（ （1-2）+1）-1 的布局结构示意图。 6、画出一个1-（ （1+（3-1-2） ）-1 的布局结构示意图。 7、解释以下CSS 样式的含义。 #header,#pagefooter,#container margin:0 auto; width:85%; #content

23、position:absolute; width: 300px; 设置 id 属性为 header、pagefooter、container 的 div 层上 下外边框为0，左右外边框为auto，宽度为相对于父元素宽 度的 85% 设置 id 属性为 content 的 div 层为绝对定位，宽度为固 定宽度 300px 8、解释以下CSS 样式的含义。 A:link COLOR: #3333cc; TEXT-DECORATION: none A:visited COLOR: #990099; TEXT-DECORATION: none A:active COLOR: #ff0000; TEX

24、T-DECORATION: underline A:hover COLOR: #3333cc; TEXT-DECORATION: underline 设置超链接样式： 未操作时：颜色为#3333cc，无下划线； 单击过后：颜色为#990099，无下划线； 单击时：颜色为 # ff0000 ，有下划线； 悬停时：颜色为 # 3333cc，有下划线； 9、写出下列要求的CSS 样式表 （1）设置页面背景图像为login_back.gif ，并且背景图像垂 直平铺。 （2）使用类选择器，设置按钮的样式，按钮背景图像： login_submit.gif ；字体颜色： #FFFFFFF；字体大小： 14

25、px； 字体粗细： bold；按钮的边界、边框和填充均为0px。 body background-image:url(img/login_back.gif); background-repeat:repeat-y; .picButton background-image:url(img/login_submit.gif); color:#FFFFFF; font-size: 14px; font-weight:bold; margin: 0px; border:0px; padding: 0px; 10、写出下列要求的CSS 样式表 （1）使用 标签样式，设置字体颜色：#2A1FFF ；字体大 小： 14px。内容与边框之间的距离：5px。 （2）使用超链接伪类：不带下划线；颜色：#333333；鼠标 悬停在超链接上方时，显示下划线；颜色：#FF5500。 td color: #2A1FFF; font-size: 14px; padding:5px; A color:#333333; text-decoration:none; A:hover color:#FF5500; text-decoration:underline;