zoukankan      html  css  js  c++  java
  • DIV浮动IE文本产生3象素的bug

     描写叙述:DIV浮动IE文本产生3象素的bug    左边对象浮动。右边採用外补丁的左边距来定位,右边对象(div)会离左边有3px的间距

    复现:在开发者工具里把文本模式设置了杂项后会出现3像素的bug

    測试的浏览器:IE7、IE8



    浏览器的标准模式与怪异模式两种械,怎样区分这两种模式?
    加上<!DOCTYPE html>是标准模式,反则去掉是怪异模式(杂项模式)
    调用下面JS代码来推断属于那种模式:
    console.log(window.top.document.compatMode) ;
    //BackCompat  表示怪异模式
    //CSS1Compat  表示标准模式

    CSS:

      #box {
         600px;
        height:100px;
        margin:100px auto;
        background:blue;
      }
      #left {
        float: left;
         50%;
        height:100px;
        background:red;
      }
      #right {
         100%;
        height:100px;
        background:yellow;
      }
      *html #left {
        margin-right:-3px;
        /* 上面这句是重点 */
      }

    HTML:

    <div id="box">
      <div id="left">1</div>
      <div id="right">|2</div>
    </div>


    不加margin-left:-3px的效果是:



    加margin-left:-3px的效果是:




    在CSS样式表中最后一个选择器 *html是什么意思呢?

    本人在ie8 ie7浏览器下測试,文本模式选择设置为杂项时。*html请作用






  • 相关阅读:
    3.16 使用Zookeeper对HDFS HA配置自动故障转移及测试
    4、html的body内标签之input系列
    Gym
    Gym
    Gym
    Gym
    Gym
    Big Event in HDU HDU1171 (多重背包)
    Coins POJ 1742 多重背包部分和
    HDU 1059 Dividing 多重背包
  • 原文地址:https://www.cnblogs.com/mfmdaoyou/p/7236356.html
Copyright © 2011-2022 走看看