如何消除inline-block屬性帶來(lái)的標(biāo)簽間間隙
1、給inline-block元素設(shè)置一個(gè)父元素。
設(shè)置父元素的font-size：0；。子元素font-size設(shè)置成合適大小，如果不設(shè)置子元素font-size，子元素會(huì)繼承父元素的0；
2、給inline-block元素設(shè)置一個(gè)父元素。(letter-spacing：字符間距)
設(shè)置父元素的letter-spacing為-4px或-8px，除谷歌是-8px外，其余是-4px。同樣要設(shè)置子元素的letter-spacing：0；否則會(huì)
繼承父元素，造成子元素內(nèi)文字變形。
經(jīng)過試驗(yàn)，統(tǒng)一設(shè)置成-8px，在視覺上沒有什么差異，不知道這樣做可行不可行，如果哪位有意見，隨時(shí)可以說。
3、給inline-block元素設(shè)置一個(gè)父元素。(word-spacing：?jiǎn)卧~間距)
設(shè)置父元素的word-spacing為-4px或-8px，谷歌，360是-8px，火狐，IE是-4px。同樣要設(shè)置子元素的word-spacing：0；否則會(huì)繼承父元素，造成子元素內(nèi)文字變形。
同上也可以統(tǒng)一設(shè)置為-8px
4、以上谷歌、火狐、360的測(cè)試均是在最新瀏覽器上測(cè)試，IE8測(cè)試。如有不妥還請(qǐng)告知。
以上內(nèi)容是小編給大家介紹的inline-block屬性帶來(lái)的標(biāo)簽間間隙問題，希望對(duì)大家有所幫助！
相關(guān)文章
相信大家都知道圖表是數(shù)據(jù)圖形化的表示，通過形象的圖表來(lái)展示數(shù)據(jù)，比如條形圖，折線圖，餅圖等?？梢暬瘓D表可以幫助開發(fā)者更容易理解復(fù)雜的數(shù)據(jù)，提高生產(chǎn)的效率和Web應(yīng)用和項(xiàng)目的可靠性。現(xiàn)在就讓我們大家一起來(lái)學(xué)習(xí)用D3.js來(lái)實(shí)現(xiàn)餅圖的方法，有需要的可以參考借鑒。2016-09-09
事件是將JavaScript腳本與網(wǎng)頁(yè)聯(lián)系在一起的主要方式，是JavaScript中最重要的主題之一。本文將詳細(xì)探討JavaScript的事件機(jī)制，并對(duì)比分析了瀏覽器之間的不同，具體內(nèi)容包括事件流、事件處理程序綁定方式、事件對(duì)象等。2017-01-01
js實(shí)現(xiàn)base64文件的處理以及下載方法
Base64是一種將二進(jìn)制數(shù)據(jù)編碼為ASCII字符的編碼方式,這篇文章主要給大家介紹了關(guān)于js實(shí)現(xiàn)base64文件的處理以及下載的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-07-07
現(xiàn)代配置YAML對(duì)比JSON優(yōu)勢(shì)分析
這篇文章主要為大家介紹了關(guān)于現(xiàn)代配置指南中YAML對(duì)比JSON的優(yōu)勢(shì)分析說明，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步2022-02-02
JavaScript Typescript基礎(chǔ)使用教程
TypeScript是Microsoft（微軟）開發(fā)的一種開源編程語(yǔ)言，它充分利用了JavaScript原有的對(duì)象模型，并在此基礎(chǔ)上進(jìn)行了擴(kuò)充，TypeScript設(shè)計(jì)目標(biāo)是開發(fā)大型應(yīng)用，它可以編譯成純JavaScript，編譯出來(lái)的JavaScript可以運(yùn)行在任何一種JS運(yùn)行環(huán)境中2022-12-12
又一款js時(shí)鐘!transform實(shí)現(xiàn)時(shí)鐘效果
又一款js時(shí)鐘!這篇文章主要為大家詳細(xì)介紹了transform實(shí)現(xiàn)的時(shí)鐘效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-08-08
TypeScript 提供了路徑別名的功能,方便開發(fā)者在大型項(xiàng)目中更高效地引用模塊,減少相對(duì)路徑的冗長(zhǎng)與復(fù)雜,本文將詳細(xì)介紹如何配置路徑別名,如何結(jié)合 Vite 和 Node 環(huán)境進(jìn)行別名設(shè)置,幫助開發(fā)者在項(xiàng)目開發(fā)中更為便捷地組織代碼,需要的朋友可以參考下2025-03-03
JS實(shí)現(xiàn)單擊輸入框彈出選擇框效果完整實(shí)例
這篇文章主要介紹了JS實(shí)現(xiàn)單擊輸入框彈出選擇框效果的方法,涉及JavaScript響應(yīng)鼠標(biāo)事件動(dòng)態(tài)操作頁(yè)面元素與相關(guān)屬性的實(shí)現(xiàn)技巧,需要的朋友可以參考下2015-12-12
layui數(shù)據(jù)表格 table.render 報(bào)錯(cuò)的解決方法
今天小編就為大家分享一篇layui數(shù)據(jù)表格 table.render 報(bào)錯(cuò)的解決方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來(lái)看看吧2019-09-09
基于JavaScript實(shí)現(xiàn)網(wǎng)頁(yè)倒計(jì)時(shí)自動(dòng)跳轉(zhuǎn)代碼
這篇文章主要介紹了基于JavaScript實(shí)現(xiàn)網(wǎng)頁(yè)倒計(jì)時(shí)自動(dòng)跳轉(zhuǎn)代碼 的相關(guān)資料,需要的朋友可以參考下2015-12-12