CSS中的 inline-block 導致換行問題

最近在寫導航的時候,使用了inline-block,之前的都是用float寫,沒有遇到今天的換行問題,打開調試模式,查看padding和margin均爲0,也就是說,問題並不是出現在換行元素本身上邊,於是查找了一些資料,瞭解到* inline-block是包含空格、換行符的,所以會導致inline-block產生不可見的間距,就出現了無法理解的換行。

查看大神們的解決辦法,瞭解到,可以通過以下辦法去解決:

1.不設置display:inline-block,而是用我們熟悉的float來實現,這個辦法就是換了一種思路,你有問題是吧,好,我換一種實現思路就好了。

2.設置父元素的屬性:white-space: nowrap,強制不換行(不推薦使用)

3.父元素:font-size: 0(完美解決)

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章