首先我們看一下問題
容器可疑包裹div>
.content
style
>
class
=>
class
="content"
>
div>
class
="content"
>
div>
class
="content"
>
div>
class
="content"
>
div>
class
="content"
>
div>
div>
.content
但是如果我們設定了float屬性就會出現這樣問題
為什麼會出現這樣的情況:因為我們給元素加了float屬性,這個元素就有了浮動流,不能被普通塊級元素發現。
底層原理:設定了float屬性和display:absolute;會被自動轉換為inline-block
inline-block元素的特點是寬高如果不設定會根據內部元素撐起大小設定,而block元素則不然,block元素的高有內部元素撐起,寬預設100%;
方法一:給父級元素也設定float屬性
(不建議)
原理浮動元素可以發現浮動元素
方法二:在父級元素下面加乙個邏輯性塊元素為此元素加屬性clear:both;
.clear
用float可以解決程式設計中的哪些問題:其他風法
給父級加display:inline-block;
//注意修改劇中方式margin:0 auto不管用了
報紙布局的問題:我們給塊級元素比如img標籤設定display:inline-block屬性或者inline屬性都不能讓後面緊跟的文字上邊界對齊只能下邊界對齊,這時我們只需要給塊級元素設定float屬性就可以解決
解決子元素設定浮動影響父元素問題
例 lang zh cn charset utf 8 body div0 div2,div3 style head class div0 class div2 div class div3 div div body html 此時父元素div0無法包含子元素,解決辦法 1.給父元素設定overflo...
關於元素絕對定位的父元素問題
在乙個技術群裡看到別人爭論關於子元素絕對定位,父元素要是也是絕對定位了,子元素應該選擇以誰為參照物的問題,我剛開始想都沒想就覺得它應該選擇父元素的父元素為參照物,但是自己寫個例子測試了一下,發現自己被以前書上的那些教程引導錯了,經過測試發現子元素的如果是絕對定位,他的參照父元素應該選擇離它最近的乙個...
子元素使用float,如何撐開父元素
子元素使用float,導致其脫離文件流,父元素塌陷問題的解決方法 html all1 left1 1div left2 1div style clear both div div css left1 left2 all1 這個方法的關鍵在於用了clear both來清除了浮動元素,把父元素all1撐...