記面試後面試題總結

最近想找換一份工作，於是去面試了一家比較大的公司，以下是面試官問的幾個關於技術的面試題。

一.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秒。

　　記得的面試題大概就這些了，希望對大家有所幫助。