<style>
????????????.container{
????????????????max-width:?600px;
????????????????height:?300px;
????????????????border:?1px?solid?darkorange;
????????????????margin:?50px?auto;
????????????????}
????????????.img-box{
????????????????width:?100px;
????????????????height:?200px;
????????????????background-color:?green;
????????????????display:?inline-block;
????????????????float:?left;
????????????}
????????????.auto{
????????????????padding-left:?120px;
????????????}
????????</style>
????</head>
????<body>
????????<div?class="container">
????????????<div?class="img-box"></div>
????????????<div?class="auto">梵蒂岡梵蒂岡法國發(fā)過法國發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)發(fā)·法國梵蒂岡地方官法國法國梵蒂岡法國發(fā)過·規(guī)范化規(guī)范化規(guī)范化風格化風格化風格化發(fā)·分合同法合同法合同法合同法合同·</div>
????????</div>
????</body>
</html>張大神講的兩列自適應布局,為什么是用padding-left?????????? 我發(fā)現(xiàn)margin-left也是可以的,但是對于用padding不懂
2 回答

渠清
TA貢獻11條經(jīng)驗 獲得超7個贊
其實你完全可以這么想像:
》有一個矩形盒子(盒子沒有厚度,可以想著厚度任意),有上、右、下、左四個可以伸縮的邊。
》這個矩形盒子的寬、高就對應你設置的width、height值,就是你能裝東西的空間。
》盒子框就對應border值。
》假如你裝的東西易碎,你要在盒子里塞些泡沫進行保護,就是這里的padding值,只是這盒子可伸縮,你塞哪邊就在哪邊增加塞的數(shù)量,如padding-left:10px;就是在左邊塞10px,增加了盒子寬度,也讓內(nèi)容與盒子左邊間隔10px。
》而margin值可以看作給盒子設置的保護,在保護區(qū)內(nèi),不能放其他東西。就如這是他的底盤。這就并不影響盒子實際的大小。
不知這樣你能否理解?
添加回答
舉報
0/150
提交
取消