zoukankan      html  css  js  c++  java
  • 兼容问题


    1:浏览器兼容问题一:不同浏览器的标签默认的外补丁和内补丁不同

      问题症状:随便写几个标签,不加样式控制的情况下,各自的margin 和padding差异较大。
      碰到频率:100%
      解决方案:CSS里 *
      备注:这个是最常见的也是最易解决的一个浏览器兼容性问题,几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0。


    2:浏览器兼容问题二:块属性标签float后,又有横行的margin情况下,在IE6显示margin比设置的大
    <div id="first"></div>
    #first{
    background-color: red;
    200px;
    height: 200px;
    float: left;
    margin-left: 100px;
    display: inline;
    }

    3: 浏览器兼容问题三:设置较小高度标签(一般小于10px),在IE6,IE7,遨游中高度超出自己设置高度
      问题症状:IE6、7和遨游里这个标签的高度不受控制,超出自己设置的高度
      碰到频率:60%
      解决方案:给超出高度的标签设置overflow:hidden;或者设置行高line-height 小于你设置的高度。
    #first{
    background-color: red;
    200px;
    height: 10px;
    overflow: hidden;
    }

    <div id="first"></div>

    4:
    几个img标签放在一起的时候,有些浏览器会有默认的间距,加了问题一中提到的通配符也不起作用。

    使用float属性为img布局
    <img src="images/20664369-1_b.jpg" alt="" class="img">
    <img src="images/20670230-1_b.jpg" alt="" class="img">
    <img src="images/20679764-1_b.jpg" alt="" class="img">

    .img{
    background-color: red;
    float: left;
    }

    5:ie6 不支持 fixed 这个东西,所以我们的该怎么做呢?

    6:关于手形光标. cursor: pointer. 而hand 只适用于 IE.

    7:浮动ie产生的双倍距离
    #box{ 200px;
    height: 200px;
    background-color: red;
    float:left; 100px; margin:0 0 0 100px;}

    <div id="box"></div>
    解决方案:display: inline---/使浮动忽略

    8:ie7,ie8,firefox,chrome等高端浏览器下,已经可以识别 !important属性,但是Ie6是不行的
    #colortest
    {border:20px solid #60A179 !important;
    border:20px solid #00F;
    padding: 30px;
    width : 300px;}

    <div id="colortest"></div>


    这里有个新的东西if ie

    <style type="text/css">
    #colortest
    { 100px;height: 100px;background-color: red}
    </style>
    <!--[if IE]>
    <style type="text/css">
    #colortest
    { 100px;height: 100px;background-color: blue}
    </style>
    <![endif]-->

    <div id="colortest"></div>
    可以判断当前浏览器是否为ie浏览器


    http://www.suidao.in/invi/gvbadn

  • 相关阅读:
    线程池的创建方式
    lock和synchronized如何选择?
    Java中常用的url签名防篡改方法
    jvm异常记录
    mysql索引
    PHP:PDO prepare预处理
    零度CC JavaScript获取页面、屏幕尺寸大小
    【转】 Javascript中document.execCommand()的用法
    获取元素的属性-border问题
    CSS样式定义的优先级顺序总结
  • 原文地址:https://www.cnblogs.com/mishiyang/p/4824033.html
Copyright © 2011-2022 走看看