兩個span元素中間的空格間隙

2021-10-09 07:32:32 字數 892 閱讀 4637

初學html、css的同學是不是遇到過這樣乙個問題?一對好朋友(兩個span元素)之間總是存在間隙。就像下圖那樣:

這是一對不快樂的 span,因為他們中間有了間隙

當我們給span元素新增了內容時,兩個相鄰的span元素的文字之間有乙個間隙

問:那麼這個間隙到底是什麼呢?

其實它是乙個空格。

問:那這個空格時怎麼來的呢?

首先先來看看我們平時的**書寫習慣吧

我們是優秀的程式猿,**要求格式要規範,所以我第二個span換行了

而就是這個沒毛病的換行,讓兩個span差生了間隙。

讓我們來看看怎麼解決吧

聰明的你靈機一動,將**寫一行撒

這種方法最是簡單粗暴的解決了問題,但是粗暴的方式往往會造成很多不可控的因素,後期的很多場景中也有可能讓人崩潰,畢竟團隊合作開發專案是多人參與,對於要求**書寫規範的人來說,這樣的寫法簡直壓死強迫症......(腦袋裡面已經有畫面了- -.)

來看看第二種方法吧

給父元素新增font-size:0;在給span額外新增font-size:;

激動的心,顫抖的手,此刻的內心:we made it !!!

但這種方法也存在問題,先是font-size被重寫一次(first blood),再者是一些老版本的瀏覽器下依舊會有間隙(double kill)或者有些瀏覽器對於font-size:12px;的支援不友好(trible kill)。

大神的解決辦法:

給span加上浮動,完美解決,哈哈哈滿上...

你是來騙我們關注的吧!

兩個span標籤 或i標籤 之間有間隙的問題

有三個i標籤,中間乙個放文字,前後兩個放的是iconfont 效果圖如下 會發現三個i標籤渲染出來之後中間會有挺大的空隙 嘗試設定邊距為0無果 解決方法 去掉三個i標籤前後的空格 換行也不行 讓它們連著寫 的確有效果,但是這樣 太亂,看著難受 方法二 將父元素font size設定為0 在子元素 i...

求兩個整型數的中間值

已知有兩個整型變數int a和int b,求這兩個數的中間值,即int c c a b 2 你能想出上述操作可能會存在的問題嗎?答案是,加法過程中可能會溢位。因此,我們可以這麼做 c a 2 b 2 雖然解決了溢位的問題,但仍然還有缺點,你能想到是什麼嗎?答案是,用了兩次除法,執行效率會顯著降低,因...

Unity兩個NGUI Panel 中間夾粒子特效

目前這個粒子是在panel後面。要想使粒子在兩個nguipanel中間首先需要解決的問題 預設ngui中panel的render queues從3000開始往上增加。你可以通過render q來修改。如果你想在兩個panel中間增加粒子,只要修改兩個panel的render queue乙個高於粒子,...