一行有5列，第2、4列寬度150px，其他3列平均分配剩下的寬度：
思路：設置1、3、5寬度為33.33%-100px，3列的寬度就是99.99%-300px，再加上2、4列的寬度和300px，5列的寬度和≈100%，用這個思路可以應付各種復雜的自適應布局。
方法：但是寬度沒有33.33%-100px這種寫法，所以要用marging減少寬度，還要padding來減少自己內容寬度，避免內容與旁邊的重疊
注意：box-sizing: border-box;這個屬性是保證寬度不受padding影響
<!doctype html> <html> <head> <meta charset="utf-8"> <title>col</title> </head> <style> html,body{padding:0; margin:0} div{ float:left; word-break:break-all} .c2{width:150px;background:#FCF;} .c4{width:150px;background:#0CF;} .c1,.c3,.c5{ width:33.33%; -webkit-box-sizing: border-box; box-sizing: border-box; } .c3,.c5{ margin-left:-100px; padding-left:100px; } .c1{ margin-right:-100px; padding-right:100px; } </style> <body> <div class="c1">111111111111111111111111111111111111111111111111</div> <div class="c2">2222222222222222222222222222</div> <div class="c3">333333333333333333333333333333333333333333333333</div> <div class="c4">4444444444444444444444444444</div> <div class="c5">555555555555555555555555555555555555555555555555</div> </body> </html>