開心一笑
夕陽西下,我扶著八萬多一平米房子的陽臺扶手,抽著煙,看著眼前花了一百多萬裝修的豪華游泳池,思緒萬千。
人活著究竟為了什么?錢,還是權?有錢有權之后呢?難道就沒有了追求嗎?
我陷入了深深的思索中。這時身后走來一位美麗動人的少婦,對我說:師傅,水管修好了嗎?……[捂嘴]
提出問題
margin和padding區別在哪里呢???
解決問題
本身不是做前端開發的,這兩個樣式自己也搞不清楚,但碰到問題了,
總得去解決,糾結是沒用的. 希望寫完這篇博客,能徹底吧它弄明白,
這樣目的就達到了,同時可以幫助更多的人,動手吧,攻城師們.....
margin: 外邊距
padding:內邊距
實例一:
<html>
<body>
<body>
<div style="border: solid;width:300px;height:300px">
<div style="
border: solid;
width: 99px;
height: 99px;
padding-left: 30px;
padding-top: 30px;
margin: 100px;">
div2
</div>
</div>
</body>
</body>
</html>
很明顯,在圖中:
1就是:margin: 100px
2就是:padding-left: 30px
實例二:
看看上面代碼在google瀏覽器的樣子:
其他:
(1)padding-left:10px; 左內邊距
(2)padding-right:10px; 右內邊距
(3)padding-top:10px; 上內邊距
(4)padding-bottom:10px; 下內邊距
(5)padding:10px; 四邊統一內邊距
(6)padding:10px 20px; 上下、左右內邊距
(7)padding:10px 20px 30px; 上、左右、下內邊距
(8)padding:10px 20px 30px 40px; 上、右、下、左內邊距
(1)margin-left:10px; 左外邊距
(2)margin-right:10px; 右外邊距
(3)margin-top:10px; 上外邊距
(4)margin-bottom:10px; 下外邊距
(5)margin:10px; 四邊統一外邊距
(6)margin:10px 20px; 上下、左右外邊距
(7)margin:10px 20px 30px; 上、左右、下外邊距
(8)margin:10px 20px 30px 40px; 上、右、下、左外邊距
上面內容,引用不知名高手文章:
http://www.studyofnet.com/news/35.html
個人感悟
雖然內容很簡單,但是一折騰,發現就都明白了。說明:人或者事,基本都是折騰出來的