塊級元素設置成內聯元素出現的一些問題

以div爲例
1.
就是關於設置兩個div的方框,設置display:inline-block屬性,兩個方框會在一行排列
但是中間會有很小的一點間隙,那麼問題來了,怎麼去除這個間隙呢?
因爲塊級標籤設置了dispaly:inline-block屬性,會變成內聯標籤,如果兩個或多個div之間不在同一行,那麼瀏覽器會默認這兩個或多個div之間有空格,所以間隙就是這麼來的。
解決辦法:
(1)就是把div標籤寫在同一行。
(2)如果標籤裏寫的有字體,設置font-size:0;
(3)設置某一個塊級元素,margin-left或者margin-right,屬性值爲負值(值不要設置太大,可以一點點的調試),那麼就會向右或者向右移動。
2.
就是在一些div的方框裏輸入一些字體,有時候字體會把方框給擠開,這樣的問題怎麼辦呢?
解決方法:
因爲CSS中有一種基線的知識,就是x-height爲基準x的高度。在CSS中設置vertical-align:top,這樣問題就可以解決。
發佈了46 篇原創文章 · 獲贊 5 · 訪問量 1萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章