专业转换Web基础复习题.doc

一、单项选择题1. 哪个CSS属性可控制文本的尺寸？（A）A) font-size B) text-style C) font-style D) text-size 2. 我们在HTML页面中制作了一个图像，想要在鼠标指向这个图像时浮出一条提示信息，应该使用哪个参数做到？（C）A)POP B)SRC C)ALT D)MSG3. 哪一个标记用于使HTML文档中表格里的单元格在同行进行合并？(D)A)cellspacing B)cellpadding C)rowspan D)colspan4. 哪个标记用于表示HTML文档的结束？(B)A)/BODY B)/HTML C)/TABLE D)/TITLE5. 我们希望制作一个表示左-上-下格式的框架页面,如图所示：我们需要独立制作几个文件？（D）A)1 B)2 C)3 D)46. 以下哪个项目不是可以在HTML文档中使用的特殊字符。（B）A)> B)&tl; C)© D) 7. 以下的CSS中，可使所有元素变为粗体的正确语法是?(c)A) B) C) p font-weight:bold D) p text-size:bold 8. 如何显示没有下划线的超链接？(A)A) a text-decoration:none B) a text-decoration:no underline C) a underline:none D) a decoration:no underline 9. 如何在警告框中写入“Hello World”？(c)A) alertBox=Hello World B) msgBox(Hello World) C) alert(Hello World) D) alertBox(Hello World) 10. 如何编写当i不等于5时执行某些语句的条件语句？(D)A) if =! 5 then B) if 5 C) if (i 5) D) if (i != 5) 二、简答题1. 写出CSS选择器种类，并举例说明（写出五种即可）一、 基本选择器1. * 通用元素选择器，匹配任何元素2. E 标签选择器，匹配所有使用E标签的元素3. .info class选择器，匹配所有class属性中包含info的元素4. #footer id选择器，匹配所有id属性等于footer的元素实例：* margin:0; padding:0; p font-size:2em; .info background:#ff0; #info background:#ff0; 二、多元素的组合选择器序号 选择器 含义1. E,F 多元素选择器，同时匹配所有E元素或F元素，E和F之间用逗号分隔2. E F 后代元素选择器，匹配所有属于E元素后代的F元素，E和F之间用空格分隔3. E F 子元素选择器，匹配所有E元素的子元素F4. E + F 毗邻元素选择器，匹配所有紧随E元素之后的同级元素F实例：div p color:#f00; #nav li display:inline; div strong color:#f00; p + p color:#f00; 三、属性选择器序号 选择器 含义1. Eatt 匹配所有具有att属性的E元素，不考虑它的值1. Eatt=val 匹配所有att属性等于“val”的E元素3. Eatt=val 匹配所有att属性具有多个空格分隔的值、其中一个值等于“val”的E元素4. Eatt|=val 匹配所有att属性具有多个连字号分隔（hyphen-separated）的值、其中一个值实例：ptitle color:#f00; divclass=error color:#f00; tdheaders=col1 color:#f00; plang|=en color:#f00; blockquoteclass=quotecite color:#f00; 四、伪类序号 选择器 含义13. E:first-child 匹配父元素的第一个子元素14. E:link 匹配所有未被点击的链接15. E:visited 匹配所有已被点击的链接16. E:active 匹配鼠标已经其上按下、还没有释放的E元素17. E:hover 匹配鼠标悬停其上的E元素18. E:focus 匹配获得当前焦点的E元素19. E:lang(c) 匹配lang属性等于c的E元素实例：p:first-child font-style:italic; inputtype=text:focus color:#000; background:#ffe; inputtype=text:focus:hover background:#fff; q:lang(sv) quotes: 201D 201D 2019 2019; 五、伪元素序号 选择器 含义20. E:first-line 匹配E元素的第一行21. E:first-letter 匹配E元素的第一个字母22. E:before 在E元素之前插入生成的内容23. E:after 在E元素之后插入生成的内容实例：p:first-line font-weight:bold; color;#600; .preamble:first-letter font-size:1.5em; font-weight:bold; .cbb:before content:; display:block; height:17px; width:18px; background:url(top.png) no-repeat 0 0; margin:0 0 0 -18px; a:link:after content: ( attr(href) ) ; 1：标签名选择器一个XHTML文档中有许多标签，例如p标签，h1标签等。若要使文档中的所有p标签都使用同一个CSS样式，就应使用标签选择器。div color:red;border:1px blue solid;p color:#000;2：类选择器使用标签选择器可以为整个XHTML文档中的同一个标签指定相同的CSS样式。但是在实际运用中，XHTML文档中的同一个标签会被反复使用。若要为相同的标签赋予不同的CSS样式就应使用类选择器。测试代码.test color:red;border:1px blue solid;在html文档里，我们在要控制样式的标签的开标签（非成对标签如input直接放在标签里）里加入 class=xxx,在页面对应的css文件里，用.xxx就可以指向这个标签，从而对这个标签进行控制，我们称这种通过定义类（class）来找到标签的方式为 ：类选择器。这种定义class 的方式是前端开发最常用的选择器，有几个突出的特点：可以给不同的标签设置同一个类，从而用一条CSS命令控制几个标签，减少大量代码，是页面修改简单，易维护，易改版；其次，后台工作人员机会不会用到有关class的相关设置，不需要跟后台人员之间进行交互；再者，可以通过js等动态改变标签的Classname，从而改变整个标签的样式，使前端动态效果实现起来更为容易。3：ID选择器ID选择器和类选择器相似，不同的是，ID选择器不能复用。在一个XHTML文档中，一个ID选择器只能把其CSS样式指定给一个标签。测试代码#test color:red;border:1px blue solid;有 ID 的 HTML元素可以被JavaScript来操纵.再就是ID也是后台开发人员会经常用的，所以前端开发人员应该尽量少的使用。4.全局选择器全局选择器是一个星号。它能作用于XHTML文档中的所有元素。*margin:0; padding:0;5.组合选择器标签选择器、类选择器和ID选择器是可以组合起来使用的。一般的组合方式是标签选择器和类选择器组合，标签选择器和ID选择器组合。由于这两种组合方式的原理和效果一样，所以只介绍标签选择器和类选择器的组合。组合选择器只是一种组合形式，并不算是一种真正的选择器，但在实际中经常使用。比如 .orderlist li xxxx 或者 .tableset td 我们使用的时候一般用在重复出现并且样式相同的一些标签里，比如li td dd等。比如 H1.redcolor: red 群组选择器.test1,span,test2 border:1px blue solid;div,span,img border:1px blue solid;群组选择器实际上是对CSS的一种简化写法，只不过把有相同定义的不同选择器放在一起，省了很多代码。6.继承选择器学习使用继承选择器就必须先了解文档树和CSS的继承。每个XHTML都可以被看作一个文档树，文档树的根部就是html标签，而head和body标签就是其子元素。在head和body里的其他标签就是html标签的孙子元素。整个XHTML就呈现一种祖先和子孙的树状关系。CSS的继承是指子孙元素继承祖先元素的某些属性。以下通过实例来详细讲解这两个重要的CSS概念。 文档树 CSS的继承 继承选择器.test span img border:1px blue solid;div span img border:1px blue solid;后代选择器实际上是使用：多个选择器加上中间的空格来找到具体的要控制标签；从左往右，依次细化，最后锁定要控制的标签，如上例，先找到class为test的标签，再从他的子标签里查找span标签，再从span的子标签中找到IMG标签。7.伪类选择器伪类也是选择器的一种，但是用伪类定义的CSS样式并不是作用在标签上的。伪类作用在标签的状态上。由于很多浏览器支持不同类型的伪类，没有一个统一的标准，所以很多伪类都不常被用到。伪类包括：:first-child、:link:、:vistited、:hover、:active、:focus和:lang等等。其中有一组伪类是主流浏览器都支持的，就是超链接的伪类，包括:link:、:vistited、:hover和:active。a的这四个伪类，分别表示了a的四种状态，要注意的是，a可以只具有一种状态（:link），或者同时具有2种或者三种状态！比如说，任何一个有HREF属性的a标签，在未有任何操作时都已经具备了:link的条件，也就是满足了有链接属性这个条件；如果访问过的a标签，同时会具备 :link :visited 两种状态。把鼠标移到访问过的a标签上的时候，a标签就同时具备了 :link :visited :hover三种状态。a:linktext-decoration:none;2. 在HTML文档中引入CSS的方式有哪些？1。行内式即在标记的style属性中设定css样式，这种方式本质上没体现出css的优势，因此不推荐使用。2。嵌入式在对页面中各种元素的设置集中写在和之间的，对于单个页面来说，这种方式很方便divmargin: 0;padding: 0;border:1px red solid;这种方法的使用情况要少的多，最长见得就是访问量大的门户网站。或者访问量较大的企业网站的首页。与第一种方法比起来，优点突出，弊端也明显。优点：速度快，所有的CSS控制都是针对本页面标签的，没有