BAT及各大互联网公司2014前端笔试面试题(Html,Css篇)

2020-05-16 06:59:26易采站长站整理

2.CSS都有哪些选择器?

•派生选择器(用HTML标签申明)
•id选择器(用DOM的ID申明)
•类选择器(用一个样式类名申明)
•属性选择器(用DOM的属性申明,属于CSS2,IE6不支持,不常用,不知道就算了)
除了前3种基本选择器,还有一些扩展选择器,包括

•后代选择器(利用空格间隔,比如div .a{  })
•群组选择器(利用逗号间隔,比如p,div,#a{  }) 
那么问题来了,CSS选择器的优先级是怎么样定义的?

基本原则:

一般而言,选择器越特殊,它的优先级越高。也就是选择器指向的越准确,它的优先级就越高。

复杂的计算方法:

•用1表示派生选择器的优先级
•用10表示类选择器的优先级
•用100标示ID选择器的优先级
•div.test1 .span var 优先级 1+10 +10 +1 
•span#xxx .songs li 优先级1+100 + 10 + 1 
•#xxx li 优先级 100 +1

那么问题来了,看下列代码,<p>标签内的文字是什么颜色的?。

CSS Code复制内容到剪贴板

<style>   
.classA{ color:blue;}   
.classB{ color:red;}   
</style>   
<body>   
<p class=’classB classA’> 123 </p>   
</body>  

答案:red。与样式定义在文件中的先后顺序有关,即是后面的覆盖前面的,与在<p class=’classB classA’>中的先后关系无关。

3.CSS中可以通过哪些属性定义,使得一个DOM元素不显示在浏览器可视范围内?

最基本的:

设置display属性为none,或者设置visibility属性为hidden

技巧性:

设置宽高为0,设置透明度为0,设置z-index位置在-1000

4.超链接访问过后hover样式就不出现的问题是什么?如何解决?

答案:被点击访问过的超链接样式不在具有hover和active了,解决方法是改变CSS属性的排列顺序: L-V-H-A(link,visited,hover,active)

5.什么是Css Hack?ie6,7,8的hack分别是什么?

答案:针对不同的浏览器写不同的CSS code的过程,就是CSS hack。

示例如下:

CSS Code复制内容到剪贴板

#test       {      
        width:300px;      
        height:300px;      
             
        background-color:blue;      /*firefox*/  
        background-color:red9;      /*all ie*/