margin並不能夠擴大父元素的尺寸
很多初學者以為設定margin外邊距能夠撐開父元素,其實並不是這樣的。
程式碼如下:
[HTML] 純文字檢視 複製程式碼<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> #main{ width:600px; height:400px; margin:0 auto; background:green; } #inner{ width:50px; height:50px; background:#eee; margin-left:600px; } </style> </span> </head> <body> <div id="main"> <div id="inner"></div> </div> </body> </html>
上面的程式碼演示可以看出,內部的子元素只是飛出了父元素,並不會擴大父元素的尺寸,但是如果這個時候給父元素新增overflow:hidden話,子元素會被隱藏。
相關文章
- 塊級元素不能夠巢狀在<p>標籤元素中巢狀
- 將子元素的margin-top傳遞給父元素
- css設定span元素的尺寸CSS
- JavaScript拖動調整元素的尺寸JavaScript
- js如何獲取指定元素的尺寸JS
- javascript中獲取元素尺寸JavaScript
- margin尺寸百分比時的參考物件是誰物件
- 理解並運用 CSS 的負 margin 值CSS
- margin-top影響父元素定位
- 子元素的margin-top作用於外層父元素解決方法
- jQuery動態設定div元素的尺寸jQuery
- 行內元素的padding和margin屬性padding
- 行內元素的padding和margin是否有效padding
- JavaScript 拖動調整元素尺寸JavaScript
- 元素尺寸和滑鼠位置總結
- 瀏覽器/元素尺寸相關的屬性瀏覽器
- 元素的尺寸 offsetWidth和clientWidth的區別client
- 負外邊距margin對浮動元素的影響
- 設定display:none無法獲取元素的尺寸None
- javascript緩衝彈性方式設定元素的尺寸JavaScript
- CSS3動畫方式改變div元素的尺寸CSSS3動畫
- 為什麼margin-top對父元素有效
- 為什麼margin-top不是作用於父元素
- jquery動態設定元素的尺寸程式碼例項jQuery
- js獲取元素的實際尺寸程式碼例項JS
- AI不能「取代」醫生給我們看病,這並不是因為AI不夠強大AI
- margin-top失效傳遞給父元素解決方案
- span元素設定margin和padding不好用padding
- 好程式設計師web前端分享CSS不同元素margin的計算程式設計師Web前端CSS
- 負外邊距margin對於絕對定位元素的影響
- JavaScript獲取瀏覽器、元素、螢幕的寬高尺寸JavaScript瀏覽器
- 子元素超過父元素padding-right和margin-right失效padding
- CSS並不簡單--帶你認識不一樣的marginCSS
- JavaScript與CSS3動畫方式改變元素尺寸JavaScriptCSSS3動畫
- JavaScript 動畫方式設定元素尺寸和透明度JavaScript動畫
- 偽元素需要將其設定為塊級元素或者塊級內聯元素才能設定尺寸
- 不能忽略的10個網頁設計元素網頁
- float浮動元素不會有margin外邊距合併效果