瀏覽器會把 inline 內(nèi)聯(lián)元素間的空白字符（空格、換行、Tab 等）渲染成一個空格。為了美觀，通常是一個<li>放在一行，這導致<li>換行后產(chǎn)生換行字符，它變成一個空格，占用了一個字符的寬度。

解決辦法：

（1）為<li>設置 float:left。不足：有些容器是不能設置浮動，如左右切換的焦點圖等。

（2）將所有<li>寫在同一行。不足：代碼不美觀。

（3）將<ul>內(nèi)的字符尺寸直接設為 0，即 font-size:0。不足：<ul>中的其他字符尺寸也被設為 0，需要額外重新設定其他字符尺寸，且在 Safari 瀏覽器依然會出現(xiàn)空白間隔。

（4）消除<ul>的字符間隔 letter-spacing:-8px，不足：這也設置了<li>內(nèi)的字符間隔，因此需要將<li>內(nèi)的字符間隔設為默認 letter-spacing:normal。