[CSS][margin](quote)margin-top外間距會直接影響到上一層

2014-01-28

第一個子元素的margin-top會被上層的爸爸div給搶走

使用 margin 外間距

調整文字元素或圖片元素的外間距，理所當然是要使用 margin 語法,

除了第一個子元素的 margin-top 會被上層的爸爸 <div> 給搶走之外，

還會發生另一個問題，那就是如果上層的 <div> 本身也有寫 margin-top 的時候，

當 <div> 的 margin-top 比下面的第一個子元素 <h2> 的 margin-top 還大的時候，

這時 <div> 就會以自己的 margin-top 來呈現上間距，但是子元素 <h2> 的 margin-top 還是會被搶走，

照搶了不誤，但是不會呈現出來，而當 <div> 的 margin-top 比下面的第一個子元素 <h2> 的 margin-top 還小的時候，

這時 <div> 就會以搶來的子元素 <h2> 的 margin-top 來呈現上間距...

(可參考http://www.flycan.com/article/css/css-margin-top-520.html)

margin裡的auto通常是拿來「置中對齊」使用。也就是我們將左右邊界值設定為「auto」，

讓它產生置中對齊的效果。

	
					margin : 0;

	
					2
				
					/*一個值：代表上、下、左、右。margin : 0 0 0 0;的簡寫。*/

	
					3
				
					margin : 5 10;

	
					4
				
						/*二個值：值1：上下、

						         值2：左右。margin : 5 10 5 10;的簡寫。*/

	
					5
				
					margin : 5 10 15;

	
					6
				
						/*三個值：值1：上、

						         值2：左右、

						         值3：下。margin : 5 10 15 10;的簡寫。*/

	
					7
				
					margin: 1 10 5 15;

	
					8
				
						/*四個值：值1：上、

						          值2：右、

						          值3：下、

						          值4：左。*/

強烈建議購物網店或實體店家都必須使用關鍵字廣告or原生廣告來將Yahoo上與聯播網的廣大流量導至自己的網站!