首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

ie6 双方距

2013-07-09 
ie6 双边距在ie6中使用float属性的注意事项!它的源代码和实验结果如下! style typetext/cssdiv#demo1

ie6 双边距
在ie6中使用float属性的注意事项!  它的源代码和实验结果如下!

 <style type="text/css">  div#demo1,div#demo2{ height:150px; width:150px; border:1px solid #0000FF; background:#99CC00;}  #parent{ height:200px; width:600px; border:1px solid #FF0000; margin:0 auto;} #demo1{ margin-left:50px; float:left;} #demo2{ margin-right:50px; float:right;} </style> </head> <body>  <div id="parent">  <div id="demo1"></div> <div id="demo2"></div> </div> </body
>    而在ie6以上的版本中和firefox中的实验结果如下!



  
我们可以很明显的看到,在ie6以及firefox浏览器中,离红色边框的距离要小的多!而ie6距离边框的距离是ie6以上版本的二倍,这是ie6中特有的现象——双倍边距。     如果我们想解决这个问题我认为有两种方法!   1#demo1,#demo2{ display:inline}    2专门针对ie写语句 <!--[if IE 6]>  <style typte="text/css"> #demo1{ margin-left:25px;} #deom2{marign-right:25px; </style> <![endif]--> 就搞定了!    至于3像素问题:  就是说在ie6中环绕在元素周围的内容会自动的增加3像素的距离! 解决方案:  针对这个问题,我们也可以专门针对ie6写样式!此方法与上面类似。就省略不写了!

热点排行