浮動的盒子對img的影響
浮動只對下面的標準流盒子起作用,讓其浮動的盒子壓住下面的標準流盒子
示例1:
讓第一個盒子div1左浮動,第二個盒子就會移上去被div1盒子壓住。
示例2:
給第二個盒子一個左浮動,圖片並沒有像我們想象的那樣被div2壓住,而是併成一排排布。
或者又是因為圖片為行內元素的原因,所以在此再給圖片一個display: block;
結果還是併成一排顯示。
示例3:
前面的例子對盒子進行浮動測試發現,盒子與盒子之間浮動的壓住與被壓住的情況以及圖片並不會隨著盒子的浮動而被壓住,而是並排顯示。那麼我們再對圖片進行浮動進行測試,當給定圖片一個左浮動:
觀察可知第3個盒子div3被圖片壓住。
由此可得出結論:當給盒子一個浮動,盒子後面的圖片並不會出現被壓住的情況,而是並排顯示。
當給圖片一個浮動時,圖片後面的盒子出現了被壓住的情況,與盒子浮動和盒子不浮動的情況一樣。
相關文章
- 什麼是浮動?浮動帶來的影響?怎麼清除浮動?
- 盒子屬性,及浮動
- css盒子模型與盒模型的浮動CSS模型
- CSS——讓“盒子”動起來:① 浮動CSS
- 主動寫入流對@ResponseBody註解的影響
- 語言對思維的影響
- Nologging對恢復的影響(一)
- unusable index對DML/QUERY的影響Index
- Nologging對恢復的影響(二)
- 網線的分類與對網速的影響 網線對網速影響大嗎?
- SNE:全球晶片短缺對電動汽車市場的影響晶片
- INDEX建立方式對SQL的影響IndexSQL
- 關於OPcache對Swoole影響的理解opcache
- 來電對播放音樂的影響
- python:super()對多繼承的影響Python繼承
- DB2 HADR對效能的影響DB2
- FTP主動模式和被動模式(2)- 防火牆對FTP的影響 ASPFFTP模式防火牆
- 深度剖析新型冠狀病毒對全球移動經濟的影響
- windows server許可權對tomcat的影響WindowsServerTomcat
- 虛擬記憶體對 OI 的影響記憶體
- VideaHealth:人工智慧對牙科的真正影響Idea人工智慧
- 網路延遲對事務的影響
- JVM 引數調整對 sortx 的影響JVM
- Mavrck:COVID-19對創作者的影響VR
- cluster factor對執行計劃的影響
- 淺談疫情對消費金融的影響
- namespace對axis解析xml請求的影響namespaceXML
- 終端環境對go程式的影響?Go
- margin為負值對佈局的影響
- Sailthru:Facebook醜聞對人們的影響AI
- 修改系統時間對oracle的影響Oracle
- 未來AI智慧對人類的影響的利弊AI
- RAC環境下的SEQUENCE對應用的影響
- 移動辦公OA系統,對企業的的辦公有怎樣的影響?
- 物聯網技術對移動應用程式開發的影響
- Cirium:資料揭示新冠肺炎對中國航空業的影響及對全球航空旅遊增長的影響
- 數字化轉型的影響是什麼?數字化轉型對企業的影響?
- 論資訊顯示對我生活的影響