行內塊元素之間預設間距問題

2021-08-04 11:22:42 字數 599 閱讀 5424

為了個文件結構條理性,我也來個前言,雖然不知道寫個啥。但向大神學習態度不能丟。因為這個問題簡單,邏輯性不強,就直接上問題上**上解決方案了。大神勿噴,有什麼問題,別的解決方案方法,希望大神們多多指點

行內塊元素之間,瀏覽器會有乙個預設的間距,例如**之間的間距,或者是別的元素型別直接轉換過來的行內塊元素,瀏覽器都會有預設的間距。話不多說,直接上**釋其中的bug。

實現上述效果**如下:

最近總結了一些方法來解決這樣的bug,常用的方法有:

1.將所有的行內塊元素直接設定浮動,個人認為最直接的方法,當然是在適當的場景中,因為過度的浮動會產生需要清除浮動的必要(自己也總結常用的清除浮動的方法,有興趣可以喵喵看看,大神越過)。

2.在產生邊距的行內塊的父元素設定屬性:font-size:0px;

3.在父元素上設定,word-spacing(詞邊距)的值設為合適的負值即可

4.在html中將行內塊元素在同一行顯示,不要進行美觀縮排或者換行

愛**,愛生活!

元素(塊 行內 行內塊

塊元素的特點 1.支援所有樣式 2.塊級元素 獨佔一行3.塊級元素預設寬度和父元素一樣 常用塊元素塊級元素 一般 div p ol ul h1 h6 li dl dt dd等都是 初始化 樣式重置 1.實際開發中,我們會把這些預設的樣式在樣式定義開頭清除掉,清除掉這些預設樣式,方便我們寫自己的定義的...

塊元素 行內元素 行內塊元素

塊級元素 一行只能放乙個,可以設定寬度高度,預設為容器的100 可以包含任何標籤 常用元素 div hr p h1 h6 ul ol dl form table 行內元素 一行可以放多個行內元素,不可以直接設定寬度高度,預設為本身內容的寬度,容納文字或其他行內元素 常用元素 span a i em ...

行內元素 塊級元素和行內塊元素

a 標籤定義鏈結 b 字型加粗 br 換行 i 斜體文字效果 img 在網頁中嵌入 input 輸入框 span 組合文件中的行內元素 small 呈現小號字型效果 big 呈現大號字型效果 sub 定義下標文字 sup 定義上標文字 div 定義文件中的分割槽或節 dl 定義列表 dt 定義列表中...