浏览器模式

当浏览器厂商开始创建与标准兼容的浏览器时,他们希望确保向后兼容性。为了实现这一点,他们创建了两种呈现模式:标准模式(Standards Mode)和怪异模式(Quirks Mode)。

触发标准模式如下:

1、加DOCTYPE声明,比如:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html>
2、设置X-UA-Compatible触发。

怪异模式触发如下:

1、无doctype声明、定义旧的HTML版本(HTML4以下,例如3.2)
2、加XML声明,可在ie6下触发
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE ...>
3、在XML声明和XHTML的DOCTYPE之间加入HTML注释,可在ie7下触发 <?xml version="1.0" encoding="utf-8"?>
<!-- keep IE7 in quirks mode -->
<!DOCTYPE ...>
5、<!--->放在<!DOCTYPE前面 

怪异模式和标准模式最显著的差别是在IE(IE5.5的怪异模式,其他浏览器无论是怪异模式还是标准模式,它们都是W3C标准)盒子模型上,下图为怪异模式上的盒子模型:


  • IE的盒子宽度和长度需要算上边框宽度和内边距

        width=boarder_left+boarder_right+padding_left+padding_right+content_width;

  • 而标准模式下的盒子宽度和高度等于内容的宽度和高度。

        width=content_width;

        CSS3的box-sizing属性可以定义使用哪种盒子模型。

怪异模式和标准模式的差别还有某些内联元素的垂直对齐基准和表格字体元素的继承问题。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值