• IE6、IE7、Firefox之间的兼容写法


    1、 IE6、IE7、Firefox之间的兼容写法:
      
      写法一:
      
      IE都能识别*;标准浏览器(如FF)不能识别*;
      IE6能识别*,但不能识别 !important,
      IE7能识别*,也能识别!important;
      FF不能识别*,但能识别!important;
      根据上述表达,同一类/ID下的CSS  hack可写为:
      .searchInput {
      background-color:#333;/*三者皆可*/
      *background-color:#666 !important; /*仅IE7*/
      *background-color:#999; /*仅IE6及IE6以下*/
      }
      一般三者的书写顺序为:FF、IE7、IE6.
      
      写法二:
      
      IE6可识别“_”,而IE7及FF皆不能识别,所以当只针对IE6与IE7及FF之间的区别时,可这样书写:
      .searchInput {
      background-color:#333;/*通用*/
      _background-color:#666;/*仅IE6可识别*/
      }
      
      写法三:
      
      *+html 与 *html 是IE特有的标签, Firefox 暂不支持。
      .searchInput {background-color:#333;}
      *html .searchInput {background-color:#666;}/*仅IE6*/
      *+html .searchInput {background-color:#555;}/*仅IE7*/
      
      屏蔽IE浏览器:
      
      select是选择符,根据情况更换。第二句是MAC上safari浏览器独有的。
      
      *:lang(zh) select {font:12px !important;} /*FF的专用*/
      select:empty {font:12px !important;} /*safari可见*/
      
      IE6可识别:
      
      这里主要是通过CSS注释分开一个属性与值,注释在冒号前。
      
      select { display /*IE6不识别*/:none;}
      
      IE的if条件hack写法:
      
      所有的IE可识别:Only IE


      只有IE5.0可以识别:Only IE 5.0


      IE5.0包换IE5.5都可以识别:Only IE 5.0+


      仅IE6可识别: Only IE 6-


      IE6以及IE6以下的IE5.x都可识别:Only IE 6/+


      仅IE7可识别: Only IE 7/-
      
      2、清除浮动:


      在Firefox中,当子级都为浮动时,那么父级的高度就无法完全的包住整个子级,那么这时用这个清除浮动的HACK来对父级做一次定义,那么就可以解决这个问题。
      select:after {
      content:”.”;
      display:block;
      height:0;
      clear:both;
      visibility:hidden;

    2、火狐,IE兼容问题


    1.今天做了一个后台管理系统的登录界面,原想把登录框放在居中的位置,在body里设置了text-align:center;当在IE6,IE7里浏览时都没有出现问题,可当在火狐里浏览是问题出现了,登录框没有居中,原先也出现这样的问题,也知道这是兼容问题,但没有去深究,只是在body里设置了个宽度,再用margin:0 auto;勉强解决了这个居中的问题,但是新的问题出现了,在一个分辨率里这个问题很好解决,当用到不同分辨率的显示器上这问题就出现了,因为设置了宽度,所以不是太长就是满屏。所以今天就特意去找了一下解决这个问题的方法,方法很简单就是在body设置text-align:center,再在div里设置margin:auto(主要是margin-left,margin-right)就可以居中了。
      如:
      body{
      text-align:center;}
      div{
      margin:auto;}
      2.在IE6里当你用div设置了一个高度很小的(<20px)分割线时,在IE6里浏览时即使你设置的高度是5px,但显示的高度远大于5px,这是IE6里DIV有一个宽度和最小高度。如果高度设得比这个最小高度小还是以最小高度显示;而在IE7,8里面已经没有最小宽度和最小高度之说了。此时只要在div里样式上加上overflow:hidden就可以解决这问题。 overflow:hidden这个属性是定义“不显示超过对象尺寸的内容”

  • 相关阅读:
    201571030114/201571030143《小学四则运算练习软件》结对项目报告
    201571030114随机四则运算
    略读构建之法
    使用staruml学习画类图
    了解面向对象方法学的优点
    做项目的感受和心得
    项目:学生查看自己的作业情况和分数(php)
    php操作数据库的简单示例
    学习使用html与css,并尝试写php
    html和css的联系
  • 原文地址:https://www.cnblogs.com/chenyt/p/1889318.html
Copyright © 2020-2023  润新知