Bruce_Zhu 于 2016.10.23
via.https://www.zhihu.com/question/39743047
怎么消除兩個相鄰div之間的空隙
- 遇到的問題如下圖
QQ圖片20161023001930.png
-
具體原因（個人推測）
在CSS文件最開頭已經(jīng)通過通用選擇器繼承選擇了padding:0和margin:0，但是仍然會出現(xiàn)這種問題像樊。經(jīng)過代碼分析可能是將兩個div并排顯示的時候使用了display:online-block的原因，雖然online-block是行內(nèi)塊元素的屬性狭园，但是它同樣具有塊級元素的屬性吞加，即在font-size不為0的情況下會有大概3px的間隙。這樣推測的原因是在后面的解決方法中可以通過設(shè)置父元素的font-size:0來解決。
-
解決辦法
解決辦法有三種：
1、通過將兩個div緊密地寫在一起來解決這種問題
7a227e11573632e564705c1cee6ca3f6_r.png
0c861bc077d6ab3975a859cd86e9491a_b.png
0cf347d3ac5704c8f562ce33fb99f81d_b.png
1c9ccb38387ca1e6b2d1d78287ee529e_b.png
2椎组、通過設(shè)置父元素的font-size:0來解決這個問題
*該方法適用于只包含圖片的div*
3、通過margin-left/right:-3px來解決這個問題
三種方法都可以解決兩個div之間有縫隙的問題历恐，但是從實際角度出發(fā)庐杨，為了防止不必要的影響的產(chǎn)生，**盡量不要使用第三種方法去解決這一問題夹供，以免產(chǎn)生更加麻煩的后果**