前幾天寫一個頁面 發現寬度為900px的div居然放不下3個寬度為300px的內聯元素li，只好改用了float:left來佈局。後來上網一查，才知道inline-block是有預設間距的，預設間距為4px,並且inline也是有預設間距。現在就來盤點一些解決inline-block元素和inlin ...
前幾天寫一個頁面
div{width:900px;}
div li{ display:inline-block; width:300px;}
<ul>
<li></li>
<li></li>
<li></li>
</ul>
發現寬度為900px的div居然放不下3個寬度為300px的內聯元素li，只好改用了float:left來佈局。後來上網一查，才知道inline-block是有預設間距的，預設間距為4px,並且inline也是有預設間距。現在就來盤點一些解決inline-block元素和inline元素之間間距的一些方法：
1、可以在html中直接把元素寫在一行上或把閉合標簽和第二個開始標簽寫在一行或兩行間添加註釋或直接去掉閉合標簽但最後一個不能去掉。
2、設置margin-right為負值，但要考慮上下文的字體和文字大小。
3、先設定子元素字體，再設置父元素font-size:0px;////chrome中：-webkit-text-size-adjust:none;
4、設置父元素letter-spacing或word-spacing為負值，要考慮字體，子元素有文字也要註意設置letter-spacing或word-spacing的值。
5.float:left;
