网页制作案例教程HTML5 CSS3 试题及答案 项目9 CSS高级选择器

一、单选题1、下面CSS使用方法描述错误的是（）。(单选题)A、样式中的注释语法为:/*注释内容*/B、所有嵌套在某个html标签中的html标签都会自动继承外层标签设置的样式规则C、伪元素选择符是指同一个html元素的各种状态和部分内容的一种定义方式D、样式规则的优先级:外部样式表〉嵌入样式表〉内联样式表答案：C2、h1{font-size:12;color:green;}h2{font-size:12;color:green;}h3{font-size:12;color:green;}与这段代码效果等同的是（）。(单选题)A、h1,h2h3{font-size:12;color:green;}B、h1,h2,h3{font-size:12;color:green;}C、h1:h2:h3{font-size:12;color:green;}D、h1h2h3{font-size:12;color:green;}答案：B3、<style>

tablea{color:green;text-decoration:none;}

table,a{color:yellow;}

</style>

<tableborder=1><tr><td>

<a>北京</a></td></tr>

</table>

<a>太原</a>

以下说明正确的是（）。(单选题)A、北京的字体是绿色B、北京的字体是黄色C、太原的字体是红色D、太原的字体是绿色答案：A4、p,h4,h5{color:#CC66FF;}这种设置样式的方式是（）。(单选题)A、组合选择器B、包含选择器C、伪选择器D、class选择器答案：A5、使用CSS美化超链接时，设置悬停状态显示下划线，样式代码为（）。(单选题)A、a:link{text-decoration:none}B、a:hover{text-decoration:line-through}C、a:hover{text-decoration:underline;}D、a:active{text-decoration:underline;}答案：C6、p,h4,h5{color:#CC66FF;}这种设置样式的方式是（）。(单选题)A、组合选择符B、包含选择符C、伪选择符D、class选择符答案：A7、a:hover表示超链接文字在（）时的状态。(单选题)A、鼠标按下B、鼠标经过C、鼠标放上去D、访问过后答案：C8、p,h4,h5{color:#CC66FF;}这种设置样式的方式是（）。(单选题)A、组合选择符B、包含选择符C、伪选择符D、class选择符答案：A9、当<p>标记内嵌套<strong>标记时，就可以使用后代选择器对其中的<strong>标记进行控制，下列写法正确是（

）。(单选题)A、strongp{color:red;}B、pstrong{color:red;}C、strong,p{color:red;}D、p.strong{color:red;}答案：B10、CSS中，通过链接伪类可以实现不同的链接状态，下列说法错误的是（

）。(单选题)A、a:link{CSS样式规则;}

超链访问时的状态B、a:visited{CSS样式规则;}

访问后超链接的状态C、a:hover{CSS样式规则;}

鼠标经过、悬停时超链接的状态D、a:active{CSS样式规则;}

鼠标点击不动时超链接的状态答案：A11、设置超链接<a>标记中<img>的border样式为none，下列代码书写正确的是（

）。(单选题)A、a.img{border:none;}B、a#img{border:none;}C、aimg{border:none;}D、a.img{border:none;}答案：C

12、下列选项中，属于并集选择器书写方式的是（

）。(单选题)A、h1p{}B、h1_p{}C、h1,p{}D、h1-p{}答案：C13、下列选项中，符合后代选择器书写要求的是（

）。(单选题)A、pstrong{font-weight:bold;}B、p.strong{font-weight:bold;}C、p,strong{font-weight:bold;}D、p#div{font-weight:bold;}答案：A14、使用标签指定式选择器，让段落应用class名为test的类，下列写法正确的是（

）。(单选题)A、.p.test{color:red;}B、p#test{color:red;}C、p.test{color:red;}D、.p,test{color:red;}答案：C15、页面上的div标签，其HTML结构如下：

<div

id="father">

<p

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

</div>

对应的CSS样式代码如下：

#father

#son{

color:red;

}

#father

p{

color:blue;

}

div

.son{

color:yellow;

}

div

p{

color:green;

}

那么，文字的颜色将显示为（

）。(单选题)A、红色B、蓝色C、黄色D、绿色答案：A16、哪个CSS选择器用于选择所有<p>元素中的第一个子元素？A.p:first-childB.p>:first-childC.p:first-of-typeD.p:first答案：B17、哪个CSS选择器用于选择所有<div>元素中最后一个<p>元素？A.div>p:last-childB.div>p:last-of-typeC.divp:last-childD.divp:last答案：B18、哪个CSS选择器用于选择所有具有属性"data-target"的元素？A.[data-target]B.:data-targetC..data-targetD.#data-target答案：A19、哪个CSS选择器用于选择所有<a>元素，其href属性值以".pdf"结尾？A.a[href$=".pdf"]B.a[href=".pdf"]C.a:href=".pdf"D.a{href=".pdf"}答案：A20、哪个CSS选择器用于选择所有<input>元素，其type属性值为"checkbox"且被选中？A.input[type="checkbox"]:checkedB.input:checkbox:checkedC.input[type=checkbox]:checkedD.input[type="checkbox"]checked答案：A21、哪个CSS选择器用于选择所有<div>元素的直接子元素<p>，并且这些<p>元素前面有兄弟元素？A.div>p:has-siblingB.div>p:has(+)C.div>p:not(:first-child)D.div>p:first-of-type答案：C22、哪个CSS选择器用于选择所有父元素为<div>的<p>元素？A.div>pB.divpC.p>divD.pdiv答案：A23、哪个CSS选择器用于选择所有<li>元素，这些元素是其父元素的唯一<li>子元素？A.li:only-childB.li:only-of-typeC.li:onlyD.li:single-child答案：B二、多选题1、下列选项中，关于并集选择器的书写格式正确的是（）。A、p,.one{}B、p.one{}C、p,.one,#two,div.box{}D、p_.one{}答案：AC

2、关于并集选择器的描述，下列说法正确的是（

）。A、并集选择器的各个选择器通过逗号连接B、并集选择器用空格分隔C、并集选择器把选中的元素设置成相同的样式D、并集选择器不能和其他选择器一起使用答案：AC

3、关于后代选择器，下列说法正确的是（

）。A、后代选择器主要用于嵌套的标签。B、后代选择器可以用于很多层的标签嵌套。C、后代选择器多个标签之间是用空格隔开的。D、后代选择器外层标记写在前面，内层标记写在后面。答案：ABCD

4、下列选项中,关于标签指定式选择器的写法正确的是（

）。A、p.curre