<!Doctype> 文档声明,位于文档中的最前面的位置,处于<html>标签之前。此标签告知浏览器文档使用哪种HTML或XHTML规范。

用于告知浏览器以何种模式来渲染文档。

严格模式:页面排版和js解析是以该浏览器支持的最高标准(W3C)来执行。

混杂模式:不严格按照标准模式执行,主要用以兼容旧的浏览器,向后兼容。模拟老式浏览器的行为以防止老站点无法工作。说的透明点就是可以实现IE5.5及以下版本的浏览器的渲染模式。

Doctype不存在或格式不正确会导致文档以混杂模式呈现。

那么问题来了,严格模式和混杂模式在样式上有什么不同之处?

  区别:总体会有布局、样式解析和脚本解析三方面的区别。

  1、盒模型:在W3C标准中,如果设置一个元素的宽度和高度,值得是元素内容的宽度和高度,而在Quirks模式下,IE的宽度和高度还包含了padding和border。

  2、设置行内元素的宽高:在标准模式下,给<span>等行内元素设置width和height都不会生效,而在quirks模式下,则会生效。

  3、设置百分比的高度:在标准模式下,一个元素的高度尤其包含的内容决定,如果父元素没有设置高度,子元素设置一个百分比的高度是无效的。

  4、margin:0 auto设置水平居中:使用margin:0 auto在标准模式下可以使元素水平居中,但在quirks模式下却会失效。解决办法:用text-align属性:

    body{text-align:center;}

    #content{text-align:left;}

  5、quirks模式下设置图片的padding会失效

  6、quirks模式下Table中的字体属性不能继承上层的设置

  7、quirks模式下white-space:pre(保留空白)会失效

 那么问题来了,white-space可能的值:

  normal  默认。空白会被浏览器忽略

  pre        空白会被刘看齐保留。其行为方式类似HTML中的<pre>标签

  nowrap  文本不会换行,文本会在在同一行上继续,直到遇到<br>标签为止

  pre-wrap保留空白符序列,但是正常的进行换行

  pre-line  合并空白符序列,但是保留换行符。

  inherit    规定应该从父元素继承white-space属性的值。

关于Doctype、严格模式与混杂模式的更多相关文章

  1. Doctype 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义?

    Doctype:(Document Type)文档类型,它位于文档中最前面的位置,处于标签之前.如果你想制作符合标准的页面,一个必不可少的关键组成部分就是DOCTYPE的声明.确定了正确的Doctyp ...

  2. 浅谈!DOCTYPE声明的作用?严格模式与混杂模式的区别?

    !DOCTYPE的作用: DOCTYPE是Document Type(文档类型)的缩写,<!DOCTYPE>声明必须是html文档的第一行,位于<html>标签之前.<! ...

  3. HTML:关于HTML的Doctype和严格模式与混杂模式

     DOCTYPE标签是一种标准通用标记语言的文档类型声明,它的目的是要告诉标准通用标记语言解析器,它应该使用什么样的文档类型定义(DTD)来解析文档. Doctype可声明三种DTD类型,分别表示严格 ...

  4. 文档声明(Doctype)和<!Doctype html>有何作用? 严格模式与混杂模式如何区分?它们有何意义?

    文档声明的作用: 文档声明是为了告诉浏览器,当前HTML文档使用什么版本的HTML来写的,这样浏览器才能按照声明的版本来正确的解析. <!doctype html> 的作用就是让浏览器进入 ...

  5. web基础(四)严格模式与混杂模式

    web基础(四)严格模式与混杂模式 一.介绍 DOCTYPE 标签是一种标准通用标记语言的文档类型声明,它的目的是要告诉标准通用标记语言解析器,它应该使用什么样的文档类型定义(DTD)来解析文档.DO ...

  6. DOCTYPE声明的作用是什么?严格模式与混杂模式如何区分?

    HTML语言已经存在太久了,目前必然会有一些不同版本的文档存在,为了能够让浏览器清楚你的文档的版本类型和风格,需要在文档的起始用DOCTYPE声明制定当前文档的版本和风格.如果在网页中提供了版本信息, ...

  7. Doctype 文档类型,标准模式,混杂模式

    HTML4.01和XHTML1.0 基于 SGML,支持DTD声明,HTML5不是,但是需要 doctype 来规范浏览器的行为. 标准模式是指,DTD声明定义了标准文档的类型后,浏览器按W3C标准解 ...

  8. Doctype作用?严格模式与混杂模式如何区分?它们有何意义?

    怪异模式和严格模式(译注:一般称为标准模式:Standards Mode,下文中的严格模式都可以理解为标准模式)是浏览器解析CSS时的两种‘模式’.这篇文章将简单阐述这两种模式之间的差异. 译注:一个 ...

  9. DOCTYPE与浏览器模式详解(标准模式&混杂模式)

    关于渲染模式: 在多年以前(IE6诞生以前),各浏览器都处于各自比较封闭的发展中(基本没有兼容性可谈).随着WEB的发展,兼容性问题的解决越来 越显得迫切,随即,各浏览器厂商发布了按照标准模式(遵循各 ...

随机推荐

  1. TP-LINK配置公网映射

    公室里的主机获取到的地址是路由器分配的私网地址,通常是192.168.1.x,只有挂在同一个路由器底下的其它主机可以访问,路由器外面的主机是无法访问的.但是有时候我们希望把办公室内的服务器上的服务暴露 ...

  2. day21 03 异常处理

    day21 03 异常处理 1.什么是异常 异常:程序运行时发生错误的信号 错误:语法错误(一般是不能处理的异常) 逻辑错误(可处理的异常) 特点:程序一旦发生错误,就从错误的位置停下来,不再继续执行 ...

  3. 洛谷 4932 洛谷10月月赛II T1 浏览器

    [题解] x xor y的结果在二进制下有奇数个1,等价于x与y在二进制下的1的个数之和为奇数,因为x xor y减少的1的个数一定是偶数(两个数这一位都为1,xor的结果为0,减少了2个1) 那么答 ...

  4. 一种RC滤波电路的验证

    在做电源的时候,在开关管的D极经常是出现不想看到的尖峰脉冲.以CCFL推挽式缓冲电路为准,我与一个同学杨进行了相应的验证. 其中的出来的现象和反思如下: 1,加上电阻和电容串联的滤波的确能将尖峰脉冲消 ...

  5. 九度oj 题目1181:遍历链表

    题目1181:遍历链表 时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:3483 解决:1465 题目描述: 建立一个升序链表并遍历输出. 输入: 输入的每个案例中第一行包括1个整数:n(1 ...

  6. css3 & background & background-image

    css3 & background & background-image https://developer.mozilla.org/en-US/docs/Web/CSS/backgr ...

  7. [luoguP1010] 幂次方 ^(* ̄(oo) ̄)^

    传送门 递归.. 代码 #include <cstdio> int n; int bit[15]; inline void solve(int x) { int i, f = 0; if( ...

  8. 搜索 比MySQL快10倍?这可能是目前AWS Aurora最详解读!

    作者介绍 朱阅岸,中国人民大学博士,现供职于腾讯云数据库团队.研究方向主要为数据库系统理论与实现.新硬件平台下的数据库系统以及TP+AP型混合系统.   编者按 Aurora作为AWS云上的关系数据库 ...

  9. android开发里跳过的坑——android studio 错误Error:Execution failed for task ':processDebugManifest'. > Manifest merger failed with multiple errors, see logs

    使用AS在gradle里配置了多个定制版本,发现在编译版本切换时,会出现错误: Error:Execution failed for task ':processDebugManifest'.> ...

  10. Redundant Paths-POJ3177(强连通缩点)

    http://poj.org/problem?id=3177 题目大意:给你几个点和几条边   求你能加几条边  就可以让每一个点到达任意点都有两种方法. Description In order t ...