解決inline-block屬性帶來的標籤間間隙問題

一、給inline-block元素設置一個父元素。html

  設置父元素的font-size:0;。子元素font-size設置成合適大小,若是不設置子元素font-size,子元素會繼承父元素的0;瀏覽器

二、給inline-block元素設置一個父元素。(letter-spacing:字符間距)測試

  設置父元素的letter-spacing爲-4px或-8px,除谷歌是-8px外,其他是-4px。一樣要設置子元素的letter-spacing:0;不然會繼承父元素,形成子元素內文字變形。spa

  通過試驗,統一設置成-8px,在視覺上沒有什麼差別,不知道這樣作可行不可行,若是哪位有意見,隨時能夠說。htm

三、給inline-block元素設置一個父元素。(word-spacing:單詞間距)繼承

  設置父元素的word-spacing爲-4px或-8px,谷歌,360是-8px,火狐,IE是-4px。一樣要設置子元素的word-spacing:0;不然會繼承父元素,形成子元素內文字變形。ip

  同上也能夠統一設置爲-8pxci

四、以上谷歌、火狐、360的測試均是在最新瀏覽器上測試,IE8測試。若有不妥還請告知。get

參考:http://www.21shipin.com/html/98779.shtmlword

相關文章
相關標籤/搜索