码迷,mamicode.com
首页 > 其他好文 > 详细

前端工作遇到问题汇集

时间:2014-11-26 16:07:51      阅读:189      评论:0      收藏:0      [点我收藏+]

标签:style   io   ar   os   使用   sp   文件   on   div   

  兼容性问题:
   浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况(也就是浏览器内核不同)
   

  1.去掉iframe中横向的滚动条   

     解决办法:在加入iframe子页面中添加  html{overflow-x:hidden;}

  2.ie6中position:fixed不兼容   

    解决办法:  在固定定位的元素里。。加入*position:absolute;*top:值;*left:值;

  3.ie中图片有边框  

    解决方法:img{ border:none;}

  4.ie中:hover兼容性问题   

     解决办法:只需引用一个文件就行:csshover3.htc(文件在桌面);此文件必须和html文件在同一目录(要放在一个文件夹下面);然后调用代码.放到                  <head></head>中间:   <!--[if lte IE 6]>   <style type="text/css">   body { behavior:url("csshover3.htc"); }   </style>   <![endif]-->

  5.IE6,7支持inline元素转换成inline-block,但不支持block元素转换成inline-block

     解决办法:div{display:inline-block;*display:inline;*zoom:1;}

  6.display:inline-block后元素之间有小间距

     解决办法:可以将元素不换行书写(但可读性差)

  7.文字贯穿线方法:1:使用html标签<s>111111111111</s>;2:text-decoration:line-through;

  8.解决透明度兼容问题:

    解决办法1:filter:alpha(opacity=90);opacity: .9;(主要针对ie)

            2:  filter:alpha(opacity=50);           -moz-opacity:0.5;          -khtml-opacity: 0.5;           opacity: 0.5;   

  9.ie兼容border-radius问题:        

     解决办法1:如此在需要圆角的css中引用文件behavior: url("ie-css3.htc"),其中ie-css3.htc需要与html文件在同一目录下

          #div1{border: 1px solid red;width: 200px;height: 200px;margin:20px; behavior: url("ie-css3.htc");

          border-radius: 20px;position: relative;z-index: 1000;} <div id="div1"></div>  

    解决办法2:引用PIE.htc同上;  

    解决办法3:使用图片代替;

  10.ie中a标签点击后虚线问题:  

    解决办法:a{outline:none;border:none;}

  11.标签最低高度设置min-height不兼容

    解决办法:如果我们要设置一个标签的最小高度200px,需要进行的设置为:{min-height:200px; height:auto !important; height:200px;                                     overflow:visible;}

  12.还有一些页面在ie(6-8)下有微小的差距,这时我一般选用css hack来进行微调

    

      IE6:(只是ie6识别)

        _selector{property:value;}

        selector{property:value;property:value !important;} //IE6 不支持同一选择符中的 !important

      IE7:(只是ie7识别)

      +selector{property:value;}

      IE8:(只是ie8识别)

      selector{property:value\0;}

      IE6 & IE7:(只是ie6与ie7识别)

      *selector{property:value;}

      IE6 & IE7 & IE8::(只是ie6,ie7,ie8识别)

      selector{property:value\9;}

前端工作遇到问题汇集

标签:style   io   ar   os   使用   sp   文件   on   div   

原文地址:http://www.cnblogs.com/luoyong/p/4123330.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!