程序员人生 网站导航

IE6默认form样式bug处理

栏目:htmlcss时间:2014-07-15 23:22:13
今天在做一个网站的时候,突然发现了form表单在IE6浏览器下显示怪怪的,而在其他的浏览器显示又是正常的,不知道是什么原因,IE6默认form样式bug不知道怎么处理,后来查看了资料才知道,原理是form表单在IE6下有默认的margin属性。请看下面例子
核心代码如下:
  1. <div style="height:20px;border:1px solid gray;"></div>   
  2. <div style="border:1px solid #878787;border-top:0;">   
  3.     <form>   
  4.     <input type="text" value="程序员人生"> 
  5.     <input type="submit" name="Submit" value="提交" id="Submit"> 
  6.     </form>          
  7. </div>   
  8.                

IE6浏览器显示效果如下

火狐或IE8浏览器显示如下:

很明显IE6浏览器div会断开,大概有10-20个px,解决这个问题其实很简单,就是重置下form表单属性就可以了,把它的margin属性设为0就正常了

------分隔线----------------------------
------分隔线----------------------------

最新技术推荐