課程
/前端開發(fā)
/HTML/CSS
/十天精通CSS3
為什么設(shè)置150px 3; 和設(shè)置成100px 3 的效果是一樣的？
2015-02-09
源自：十天精通CSS3 10-1
正在回答
試了一下，發(fā)現(xiàn)從列寬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當(dāng)你三個(gè)設(shè)置為150 總長(zhǎng)度為450剩下的50會(huì)平分給三個(gè)div如果你設(shè)置colums為100px?3的話電腦會(huì)把剩下的200平分出去。以此類推但是如果你的設(shè)置的總長(zhǎng)超過500px（原長(zhǎng)度）那么界面就會(huì)有所改動(dòng)
舉報(bào)
本課程為CSS3入門教程，深刻詳解CSS3知識(shí)讓網(wǎng)頁穿上絢麗裝備
4 回答設(shè)置n-3為什么全綠了
1 回答?我想知道為什么設(shè)置line-height為100px?
3 回答不設(shè)置transtion-property效果也一樣啊
1 回答怎么設(shè)置3D舞臺(tái)布景？+3積分
1 回答input name=1 為什么name值設(shè)置的一樣，而且去掉name切換效果就沒有了
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號(hào)-11 京公網(wǎng)安備11010802030151號(hào)
購(gòu)課補(bǔ)貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動(dòng)學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號(hào)
2016-07-26
試了一下，發(fā)現(xiàn)從列寬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當(dāng)你三個(gè)設(shè)置為150 總長(zhǎng)度為450剩下的50會(huì)平分給三個(gè)div
如果你設(shè)置colums為100px?3的話電腦會(huì)把剩下的200平分出去。以此類推
但是如果你的設(shè)置的總長(zhǎng)超過500px（原長(zhǎng)度）那么界面就會(huì)有所改動(dòng)