IE6浏览器下3px解决方法_html/css_WEB-ITnose
Jun 24, 2016 am 11:41 AM
IE6浏览器下3px解决方法:
IE6下的3px问题的产生主要应该归咎于书写不规范造成的,比如我们要写一个左右两列的结构,代码如下:
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">.parent { width:300px; height:300px; background-color:red;}.left { float:left; width:100px; height:100px; background-color:green;}.right { width:100px; height:100px; background-color:blue}</style></head><body><div class="parent"> <div class="left"></div> <div class="right"></div></div></body></html>
登入後複製
以上代码中,左边的div是浮动的,第二个div非浮动的,这样的话在IE6下会产生3px问题。其实这个问题本身就是由于代码书写不标准造成的,在标准浏览器中,因为第一个div浮动后会脱离文档流,那么后面的div会填补这个div的位置,那么网页的显示效果就是第一个div会覆盖第二个div,这本身就不规范的写法。解决方法就是让第二个div也浮动起来。修改代码如下:
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">.parent { width:300px; height:300px; background-color:red;}.left { float:left; width:100px; height:100px; background-color:green;}.right { float:left; width:100px; height:100px; background-color:blue}</style></head><body><div class="parent"> <div class="left"></div> <div class="right"></div></div></body></html>
登入後複製
原文地址是:http://www.51texiao.cn/div_cssjiaocheng/2015/0501/497.html
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱門文章
擊敗分裂小說需要多長時間?
3 週前
By DDD
倉庫:如何復興隊友
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 週前
By 尊渡假赌尊渡假赌尊渡假赌
公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?
3 週前
By 王林

熱門文章
擊敗分裂小說需要多長時間?
3 週前
By DDD
倉庫:如何復興隊友
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 週前
By 尊渡假赌尊渡假赌尊渡假赌
公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?
3 週前
By 王林

熱門文章標籤

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

&lt; iframe&gt;的目的是什麼。 標籤?使用時的安全考慮是什麼?

我如何使用html5&lt; meter&gt; 要在範圍內顯示數值數據的元素?
