當(dāng)然,他們跟浮動在空間中的位置還是有差別的,項(xiàng)目中有遇到這個(gè)問題的請參考張大嬸的文章: 深入理解CSS中的層疊上下文和層疊順序 " 張鑫旭-鑫空間-鑫生活 還是要結(jié)合項(xiàng)目來看,否則看過也只是看過而已,并不會存到你的腦子里,畢竟還是相當(dāng)抽象相當(dāng)理論性的東西。借用張大神的一個(gè)總結(jié)圖:
使用絕對定位(特指absolute)做自適應(yīng)布局跟前面兩種方式?jīng)]太大差別,寬度自適應(yīng)還是在auto和100%上做文章,而位置則由top/bottom/left/right等控制。還是以圣杯布局來舉例:
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>寬度自適應(yīng)布局</title> <style> .wrap { position: relative; background-color: #FBD570; margin-left: 100px; margin-right: 150px; height: 250px; } .left { position: absolute; top: 0; left: -100px; width