前端面試 01 頁面布局

3.延伸：5種方法對比

4.總結

問題：假設高度預設100px ，請寫出三欄布局，其中左欄、右欄各為300px，中間自適應。

方法：

class

="layout float"
>
class
="left-right-center"
>
class
="left"
>
我是 left
div>
class
="right"
>
我是 right
div>
class
="center"
>
浮動解決方案
我是 center
div>
article
>
section
>

.layout.float .left

.layout.float .right
.layout.float .center

.layout.absolute .left-center-right

.layout.absolute .left
.layout.absolute .center
.layout.absolute .right

.left-center-right

.layout.flex .center

.layout.table .left-center-right

.layout.table .left-center-right div

.layout.grid .left-center-right

1.浮動

2.絕對定位

3.flex布局（css3**現）

4.**布局

5.網格布局（css3**現）

小結：沒有絕對的優勢，也沒有絕對的不足，看具體的場景。

如果題目中去掉高度已知，我們往中間的模組裡塞很多內容，讓中間的模組撐開。會發生什麼變化？哪個布局就不能用了？

涉及到的知識點：

前端面試必備技巧（一）頁面布局

題目 一 假設高度已知，請寫出三欄布局，其中左欄 右欄寬度各為300px，中間自適應，寫出多種解決方法 回答 第一種方法 浮動解決方案 1.這是三欄布局中間部分 2.這是三欄布局中間部分 第二種方法 絕對定位 1.這是三欄布局絕對定位部分 2.這是三欄布局絕對定位部分 第三種方法 flex布局 1....

Web前端面試 01

所有引用型別 函式，陣列，物件 都擁有 proto 屬性 隱式原型 所有函式擁有prototype屬性 顯式原型 僅限函式 原型物件 擁有prototype屬性的物件，在定義函式時就被建立 1.例項的隱式原型指向它建構函式的顯式原型 2查詢屬性，如果本身沒有，則會去 proto 中查詢，也就是建構函...

前端面試 前端基礎面1

1.網路七層模型 2.tcp udp 區別，tcp怎麼實現可靠傳輸 4.死鎖 5.http https1.span的padding margin 2.垂直居中方法 不僅限於flex 1.陣列reduce和map 2.解決0.1 0.2不準確的問題 3.判斷單項鍊表是否有環 參考自 現代作業系統 1....