課程
/前端開發
/HTML/CSS
/十天精通CSS3
為什么設置150px 3; 和設置成100px 3 的效果是一樣的？
2015-02-09
源自：十天精通CSS3 10-1
正在回答
試了一下，發現從列寬157px開始就變成兩列了。
源代碼
.columns {
? width: 500px;
? padding: 5px;
? border: 1px solid green;
? margin: 20px auto;?
? columns: 150px 3;
? -webkit-columns: 100px 3;
? -moz-columns: 100px 3;
? -o-columns:100px 3;
? -ms-columns: 100px 3; ?
}
源代碼顯示width為500px當你三個設置為150 總長度為450剩下的50會平分給三個div如果你設置colums為100px?3的話電腦會把剩下的200平分出去。以此類推但是如果你的設置的總長超過500px（原長度）那么界面就會有所改動
舉報
本課程為CSS3入門教程，深刻詳解CSS3知識讓網頁穿上絢麗裝備
4 回答設置n-3為什么全綠了
1 回答?我想知道為什么設置line-height為100px?
3 回答不設置transtion-property效果也一樣啊
1 回答怎么設置3D舞臺布景？+3積分
1 回答input name=1 為什么name值設置的一樣，而且去掉name切換效果就沒有了
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-07-26
試了一下，發現從列寬157px開始就變成兩列了。
2015-02-11
源代碼
.columns {
? width: 500px;
? padding: 5px;
? border: 1px solid green;
? margin: 20px auto;?
? columns: 150px 3;
? -webkit-columns: 100px 3;
? -moz-columns: 100px 3;
? -o-columns:100px 3;
? -ms-columns: 100px 3; ?
}
源代碼顯示width為500px當你三個設置為150 總長度為450剩下的50會平分給三個div
如果你設置colums為100px?3的話電腦會把剩下的200平分出去。以此類推
但是如果你的設置的總長超過500px（原長度）那么界面就會有所改動