ul在Firefox和IE下的不同表現的解決方法_經驗交流

最近做了一個oblog的系統模板，其中涉及到了ul，所以就整理出了這篇文章 這張大圖。
　　ul是一個很常用的標籤，但是因為它在Firefox和IE下的不同表現，讓人覺得它是個很難以控制的標籤。
　　ul在Firefox下有個padding值， 卻沒有margin值；而在IE下正好相反，ul有個margin值， 卻沒有padding值。 【下圖中的第二第三例的對照可以看出】
　　在Firefox下，ul的list-style預設是處於內容的外邊緣的。當然可以透過css可以將list-style置為內容的內緣。
　　透過權衡得到適合兩個瀏覽器的設定：padding:0; margin:0; list-style:inside;。也可以將ul設定為padding:0; margin:0; list-style:none;，然後為li新增背景圖片，也是很不錯的選擇。

<style type="text/css"> body{font-size:12px; margin:20px; line-height:18px;} #box{width:200px; background-color:#CC9; border:#990 1px solid;} #box ul{padding:0; margin:0; list-style:inside decimal; } </style> <div id="box"> <ul> <li>這是第一句話。 </li> <li>這是第二句話。 </li> <li>這是第三句話。 </li> <li>這是第四句話。 </li> <li>這是第五句話。 </li> </ul> </div>
[​​Ctrl A 全選注:如需引入外部Js需刷新才能執行]