DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 如何消除inline-block屬性帶來的標簽間間隙
如何消除inline-block屬性帶來的標簽間間隙
編輯:關於JavaScript     

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

  設置父元素的font-size:0;。子元素font-size設置成合適大小,如果不設置子元素font-size,子元素會繼承父元素的0;

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

 設置父元素的letter-spacing為-4px或-8px,除谷歌是-8px外,其余是-4px。同樣要設置子元素的letter-spacing:0;否則會

繼承父元素,造成子元素內文字變形。

  經過試驗,統一設置成-8px,在視覺上沒有什麼差異,不知道這樣做可行不可行,如果哪位有意見,隨時可以說。

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

  設置父元素的word-spacing為-4px或-8px,谷歌,360是-8px,火狐,IE是-4px。同樣要設置子元素的word-spacing:0;否則會繼承父元素,造成子元素內文字變形。

  同上也可以統一設置為-8px

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

以上內容是小編給大家介紹的inline-block屬性帶來的標簽間間隙問題,希望對大家有所幫助!

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved