zoukankan      html  css  js  c++  java
  • 准标准模式和标准模式之间的差别-1(旧文首发)

    "理论上,标准模式和准标准模式的区别仅在于非IE6/7浏览器对于单元格里(原文说法可能有误,经测试所有图片均受影响)图片布局的不同处理。同事渔隐做了细致地测试并给出了解决方案。

    Update 20100203:发现iframe的布局也受到影响,解决方法和图片一致。"

    http://www.chencheng.org/blog/2010/01/15/ppt-detail-on-html-spec/?replyTo=13502#comment-13503 新首页开发PPT详解 —— HTML规范 淘宝网2011 首页

    受他的启发,

    1.al标准模式:全部浏览器一致,像素差2px;

    2.标准模式:标准模式,标准浏览器有6px像素差(ie8是5px),ie6|7为2px;

    3.xml头(quirk模式),没有doctype:只有ie8保持5px像素差,其他全部一致相差2px;

    al标准模式,全部浏览器一致

    标准模式,标准浏览器一致(只有ie8相对于其他少1px)

    标准模式ie6|7 2个图片贴近

     
     
    代码
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
    <!--<!DOCTYPE html>-->
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=9">
    <title>模式测试</title>
    <meta name="Keywords" content="" /> 
    <meta name="Description" content="" />
    <style type="text/css">
    *{margin;padding0;font-familyarial;}
    #topbar}
    imgbordernone;}
    </style>
    </head>
    <body>
    <div><img src="222.gif"/><img src="222.gif"/><img src="222.gif"/><img src="222.gif"/><imgsrc="222.gif"/></div>
    <div id="topbar"><img src="123.gif" height="" width="50"/></div>
    <table>
    <tr>
        <td><img src="222.gif"/><img src="222.gif"/><img src="222.gif"/><img src="222.gif"/><imgsrc="222.gif"/></td>
    </tr>
    <tr>
        <td><img src="123.gif" height="" width="50"/><img src="123.gif" height="" width="50"/><img src="123.gif" height="" width="50"/></td>
    </tr>
    </table>
    </body>
    </html>
     
    用到的图片
         
     
  • 相关阅读:
    常用的文件查看命令
    Linux常用快捷按键
    寒冬储粮
    创建型模式:抽象工厂
    创建型模式:工厂方法
    创建型模式:单例模式
    开闭原则
    迪米特法则
    接口隔离原则
    依赖倒置原则
  • 原文地址:https://www.cnblogs.com/wuduan/p/4027671.html
Copyright © 2011-2022 走看看