今天寫一專題頁面，寫出的結果在各個瀏覽器下都不同，心情不好。。。

就是紅線的地方老對不齊。。。

在朋友指導下改了下樣式好了

右邊代碼結構

1 <div class="fr Img"> 2 <h3>相關專題</h3> 3 <a href="#"><img src="images/zt/gsqmsj/rel_img01.jpg" width="300" height="210" alt="2015屆高三期中試卷"></a> 4 <a href="#"><img src="images/zt/gsqmsj/rel_img02.jpg" width="300" height="210" alt="2015屆高三月考"></a> 5 <a href="#"><img src="images/zt/gsqmsj/rel_img03.jpg" width="300" height="210" alt="2014年全國各地高考試卷"></a> 6 <a href="#"><img src="images/zt/gsqmsj/rel_img04.jpg" width="300" height="210" alt="學案首頁"></a> 7 <a href="#"><img src="images/zt/gsqmsj/rel_img05.jpg" width="300" height="210" alt="高考寶典微信版隆重上線"></a> 8 </div> View Code

之前我是把margin-bottom放在a標簽的樣式中，后來直接把a樣式全刪掉，放到img

上面的h3定義了高度

左邊結構

1 <div class="subject" id="yy_sub"> 2 <div class="top_title"> 3 <h3 class="fl">英語</h3> 4 <a href="#" target="_blank" class="fr">MORE</a> 5 </div> 6 <div class="line"></div> 7 <ul> 8 <li> 9 <a href="#" target="_blank">2015年北京市海淀區高三上學期期末考試語文試卷（帶解析）</a> 10 <span>2014-10-25</span> 11 </li> 12 <li> 13 <a href="#" target="_blank">2015年北京市海淀區高三上學期期末考試語文試卷（帶解析）</a> 14 <span>2014-10-25</span> 15 </li> 16 <li> 17 <a href="#" target="_blank">2015年北京市海淀區高三上學期期末考試語文試卷（帶解析）</a> 18 <span>2014-10-25</span> 19 </li> 20 <li> 21 <a href="#" target="_blank">2015年北京市海淀區高三上學期期末考試語文試卷（帶解析）</a> 22 <span>2014-10-25</span> 23 </li> 24 <li> 25 <a href="#" target="_blank">2015年北京市海淀區高三上學期期末考試語文試卷（帶解析）</a> 26 <span>2014-10-25</span> 27 </li> 28 <li> 29 <a href="#" target="_blank">2015年北京市海淀區高三上學期期末考試語文試卷（帶解析）</a> 30 <span>2014-10-25</span> 31 </li> 32 </ul> 33 </div> View Code

之前是li定義了margin-bottom后來將其刪掉，加了高度，對里面的a和span都加了line-height;然后在一般瀏覽器下就好了

對于ie6 7就用hack設置下不同高度就解決了。。。

自己先記錄下來。

?

轉載于:https://www.cnblogs.com/MissBean/p/4270487.html

總結

以上是生活随笔為你收集整理的工作中的问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。