兩年工做經驗梳理40道面試題：看他如何拿下大廠offer！

距離「金九銀十」還有半個月，目前的你是否有一顆跳槽的心呢？在此以前播妞總結了一些阿里的面試題，此次播妞應粉絲的要求，總結了與前端相關的面試題，其中包括阿里+網易等大廠面試題，相信你看完以後必定會跳槽成功哦~css

因爲題目較多，答案內容較詳細，如下爲部分題目及部分答案，完整版文末查看獲取方式哦~前端

· CSS經常使用佈局web

參考答案：面試

CSS經常使用佈局爲盒模型div+css、其中須要注意IE的怪異盒模型，咱們一般經過box-sizing解決。傳統盒模型佈局方式中咱們能夠細分爲文檔流佈局、浮動佈局、定位佈局。在ie10+中咱們可使用flex佈局，其中咱們須要理解最爲核心的容器和軸的概念。二維佈局中，咱們可使用Grid佈局。對於三欄佈局，除了浮動實現方式，還有雙飛翼佈局和聖盃佈局。其實雙飛翼佈局就是對聖盃佈局的bug修復，一種改造升級。移動web開發

· 什麼是漸進式渲染（progressive rendering）瀏覽器

部分參考答案：網絡

漸進式渲染是用於提升網頁性能（尤爲是提升用戶感知的加載速度），以儘快呈現頁面的技術。在之前互聯網帶寬較小的時期，這種技術更爲廣泛。現在，移動終端的盛行，而移動網絡每每不穩定，漸進式渲染在現代前端開發中仍然有用武之地。佈局

· BFC性能

部分參考答案：字體

BFC即爲塊級格式化上下文。在普通流的Box屬於一種formatting box，類型能夠爲block或者爲inline。可是不能同時爲這二者。而且Block boxes在block formatting context裏格式化，inline boxes在inline formatting context中格式化，任何被渲染的元素都屬於一個box，不是block就是inline。

· Viewport

部分參考答案：

字面意思爲視圖窗口，在移動web開發中使用。表示將設備瀏覽器寬度虛擬成一個特定的值（或計算得出），這樣利於移動web站點跨設備顯示效果基本一致。移動版的 Safari 瀏覽器最新引進了 viewport 這個 meta tag，讓網頁開發者來控制 viewport 的大小和縮放，其餘手機瀏覽器也基本支持。

· Viewport屬性值

部分參考答案：

width 設置layout viewport 的寬度，爲一個正整數，或字符串"width-device"

initial-scale 設置頁面的初始縮放值，爲一個數字，能夠帶小數

minimum-scale 容許用戶的最小縮放值，爲一個數字，能夠帶小數

maximum-scale 容許用戶的最大縮放值，爲一個數字，能夠帶小數

· Reflow和Repaint

部分參考答案：

Reflow：

當涉及到DOM節點的佈局屬性發生變化時，就會從新計算該屬性，瀏覽器會從新描繪相應的元素，此過程叫Reflow（迴流或重排）。

Repaint：

當影響DOM元素可見性的屬性發生變化 (如 color) 時, 瀏覽器會從新描繪相應的元素, 此過程稱爲Repaint（重繪）。所以重排必然會引發重繪。

· img中的alt和元素的title屬性做用

部分參考答案：

img的alt屬性：若是沒法顯示圖像，瀏覽器將顯示alt指定的內容

元素title屬性：在鼠標移到元素上時顯示title的內容

· href和src區別

部分參考答案：

href標識超文本引用，用在link和a等元素上，href是引用和頁面關聯，是在當前元素和引用資源之間創建聯繫

若在文檔中添加href ，瀏覽器會識別該文檔爲 CSS 文件，就會並行下載資源而且不會中止對當前文檔的處理。這也是爲何建議使用 link 方式加載 CSS，而不是使用 @import 方式。

· 瀏覽器的渲染過程

部分參考答案：

解析HTML生成DOM樹；解析CSS生成CSSOM規則樹；將DOM樹與CSSOM規則樹合併在一塊兒生成渲染樹；遍歷渲染樹開始佈局，計算每一個節點的位置大小信息；將渲染樹每一個節點繪製到屏幕。

· px/em/rem的區別

部分參考答案：

px顧名思義就是咱們一般說的像素大小。em和rem都是相對大小，不過em是繼承父級元素的字體大小，rem是相對於根元素的大小，這個單位可謂是集相對大小和絕對大小爲一身。經過它能夠作到只修改根元素便可修改全部字體的大小，又能夠避免字體大小逐層複合的連鎖反應。當rem相對於瀏覽器進行縮放，1rem默認爲16px。

· animation和transition

部分參考答案：

寫法：animation：name duration timing-function delay iteration-function direction .transition爲過渡動畫，這種效果能夠在事件中觸發，而且圓滑的以動畫效果改變css的屬性值。不一樣於transform，transform爲2D轉換。