记面试后面试题总结

最近想找换一份工作，于是去面试了一家比较大的公司，以下是面试官问的几个关于技术的面试题。

一.css里面有个position，你知道它都有那几个值吗，以及它们的作用是什么？

　　这个我回答的是：

　　position一共有absolute，fixed，relative，static，inherit这几个值，其中inherit是从父元素继承 position 属性的值，而fixed是生成绝对定位的元素，相对于浏览器窗口进行定位。absolute是生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。static为默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index声明）。relative是生成相对定位的元素，相对于其正常位置进行定位。

 

二.你知道css里面有个z-index，现在有一个小A它的z-index为9，另外小B的z-index为10，其中小A 的里面又有一个小C，小C的z-index值为11，小A，小B和小C的position值都为absolute，问小C是在小B的上面还是小B的下面？

　　这道题主要考的就是对z-index和对position的掌握程度，要完全了解z-index和position的特性才能解答出来，否则就掉进面试官的设的坑里面了。大概代码如下：

　　

<div style="position:absolute;z-index:9">
    <div style="position:absolute;z-index:11"></div>
</div>
<div style="position:absolute;z-index:11"></div>

　　结果也已经显而易见，小B是在小C的上面，这主要是绝对定位的效果。

 

三.css有个能启动硬件加速的属性，你知道是哪个吗？

　　Chrome, FireFox, Safari, IE9+ 都支持硬件加速，只要使用特定的CSS语句就可以开启硬件加速:

　　

/**使用3d效果来开启硬件加速**/
.speed-3D{
   -webkit-transform: translate3d(250px,250px,250px)
   rotate3d(250px,250px,250px,-120deg)
   scale3d(0.5, 0.5, 0.5);
}

　　如果并不需要用到transform变换，仅仅是开启硬件加速，可以用下面的语句:

/**原理上还是使用3d效果来开启硬件加速**/
.speed-3d{
   -webkit-transform: translateZ(0);
   -moz-transform: translateZ(0);
   -ms-transform: translateZ(0);
   -o-transform: translateZ(0);
   transform: translateZ(0);
}

 

四.有个代码的最上面写个settimeout 延时是5秒钟，里面弹出个1，代码下面是一个操作文件的同步代码，要用12秒才能把下面的代码执行完成，问弹出1需要多久？

 

　　这个题主要考的就是js里面同步操作会不会阻止异步操作，他们两是不是互相影响，这个题如果对js不太了解，肯定也会掉进面试官的坑里，这个题的答案是弹出1需要17秒，首先settimeout是异步的，它不会阻止下面的代码执行，然而下面的代码是同步的，它需要执行完再返回执行settimeout，这样弹出1就需要了17秒。

 

　　记得的面试题大概就这些了，希望对大家有所帮助。