負(fù)邊距在讓元素產(chǎn)生偏移時(shí)和position: relative有什么區(qū)別?
- 負(fù)margin會(huì)對(duì)后面的元素產(chǎn)生影響
- position：relative只是在視覺(jué)上產(chǎn)生偏移，元素本身在文檔流中的位置不變
使用負(fù) margin 形成三欄布局有什么條件?
- 三欄元素都要浮動(dòng)
- 父容器清除浮動(dòng)吼句，并且不能用overflow清除浮動(dòng)
- 中間欄要放在文檔流最前面進(jìn)行渲染
- 左邊設(shè)置margin-left：100px根资；右邊設(shè)置margin-left：本身寬度
圣杯布局的原理是怎樣的? 簡(jiǎn)述實(shí)現(xiàn)圣杯布局的步驟
- 原理：元素設(shè)置浮動(dòng)后，可以用負(fù)margin實(shí)現(xiàn)位于兩側(cè)的效果倒槐，中間欄元素用左右padding實(shí)現(xiàn)居中旬痹，左右欄元素用position：relative實(shí)現(xiàn)頂寬并且不和中間欄重合
- 步驟：
1.設(shè)置container的左右padding，用于預(yù)留左右邊欄的空間
2.給所有元素設(shè)置定位和浮動(dòng)讨越，用于設(shè)置左右兩欄偏移
3.給左側(cè)邊欄設(shè)置right：本身寬度两残，讓其移動(dòng)至container最左邊，margin-left設(shè)置100%（center的寬度）
4.給右側(cè)邊欄設(shè)置left：本身寬度把跨，讓其移動(dòng)至container最右邊人弓，margin-left設(shè)置本身寬度
雙飛翼布局的原理? 實(shí)現(xiàn)步驟
- 原理：元素設(shè)置浮動(dòng)后，可以用負(fù)margin實(shí)現(xiàn)位于兩側(cè)的效果着逐，中間欄里定義一個(gè)新的塊崔赌，用來(lái)放置內(nèi)容
- 步驟：
1.中間欄中定義一個(gè)div，margin-left為左邊欄的寬度（可以大于）耸别，margin-right為右邊欄的寬度（可以大于）
2.給所有元素設(shè)置定位和浮動(dòng)健芭，用于設(shè)置左右兩欄偏移
3.左邊欄設(shè)置margin-left：100%，用于上浮
4.右邊欄設(shè)置margin-left：本身寬度秀姐，用于上浮
本教程版權(quán)歸饑人谷和作者所有慈迈，轉(zhuǎn)載須說(shuō)明來(lái)源。
