最近看源碼看得有點(diǎn)累，準(zhǔn)備寫一篇css的來(lái)調(diào)節(jié)一下结执。
這篇記錄學(xué)習(xí)拖了好長(zhǎng)時(shí)間，今天我準(zhǔn)備把這篇寫完艾凯。
首先献幔，先來(lái)看一下(后面我都用這個(gè)例子來(lái)講)。
<div class="container">
<input type="text">
<button>Submit</button>
</div>
看到mio趾诗，確實(shí)是有一個(gè)間隙蜡感。這個(gè)間隙是因?yàn)闃?biāo)簽在編輯器里換行瀏覽器會(huì)把它解析成空文本節(jié)點(diǎn)。那么解決的辦法是什么恃泪？
簡(jiǎn)單粗暴
最簡(jiǎn)單的辦法就是把標(biāo)簽寫成一行郑兴。
<input type="text" /><button>Submit</button>
看了一下，確實(shí)把間隙去掉了悟泵。但是如果標(biāo)簽很多杈笔，這個(gè)辦法就有點(diǎn)不好使
1. 用負(fù)margin
就是把元素的margin設(shè)置成負(fù)數(shù)闪水，這里把button的margin-left設(shè)置成-5px糕非，是可以的。
但是這個(gè)辦法有一個(gè)不好的球榆，就是不同的瀏覽器的這個(gè)間距不同朽肥，所以設(shè)置的margin-left是不同的。
2. font-size:0
.container{
font-size: 0px;
}
用這種辦法也可以解決間隙的問(wèn)題持钉，而且不會(huì)用兼容性的問(wèn)題衡招。但是需要注意的是，要給子元素設(shè)置字體大小每强，因?yàn)?code>font-size是一個(gè)可以繼承的屬性始腾。
3. letter-spacing和word-spacing
這兩個(gè)屬性的區(qū)別是什么州刽？
letter-spacing是字符間距撩银，word-spacing是單詞間距只嚣。我們可以通過(guò)將這兩個(gè)值設(shè)置為負(fù)數(shù)來(lái)消除空隙。而且瀏覽器兼容性也很好客蹋。不同的瀏覽器間隙大小不同奶栖，但是如果用letter-spacing設(shè)置值足夠大匹表，就會(huì)忽略掉兼容性的問(wèn)題，而且元素不用重合宣鄙，word-spacing如果設(shè)置的很大袍镀，元素就會(huì)重合。所以相比較起來(lái)冻晤，我更偏向使用letter-spacing苇羡。
