<!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. switch、try-catch

    记录 1. 使用对象代替 switch 和 if-else 2. 根据返回数据是否能转成对象,取值 如果返回是数字字符串,直接返回,如果返回是对象,取对应的key值,再返回 其它情况,返回空 {{ o ...

  2. Linux环境下验证码不显示F12报500

     前言: 项目之前部署在linux系统上进行测试,今天重新部署的时候,重启了tomcat然后部署新的版本项目,结果登录页面验证码不显示,在浏览器F12页面显示的是500错误.网上查了很多方法,都没效果 ...

  3. js 弹幕效果

    <!DOCTYPE HTML><html><head><meta charset="utf-8"><title>弹幕&l ...

  4. java设置项目根目录 工作目录 working dictionary

    改变java项目中,绝对路径的根目录 run->run configuration ->Arguments 更改 working dictioinary

  5. NYOJ-476谁是英雄,分解质因子求约数个数！

    谁是英雄 时间限制:1000 ms  |  内存限制:65535 KB 难度:3 描述 十个数学家(编号0-9)乘气球飞行在太平洋上空.当横越赤道时,他们决定庆祝一下这一壮举.于是他们开了一瓶香槟.不 ...

  6. B. Mr. Kitayuta's Colorful Graph，二维并查集，一个简单变形就可以水过了~~

    B. Mr. Kitayuta's Colorful Graph ->  Link  <- 题目链接在上面,题目比较长,就不贴出来了,不过这是道很好的题,很多方法都可以做,真心邀请去A了这 ...

  7. CentOS下LVS DR模式负载均衡配置详解

    一安装LVS准备: 1.准备4台Centos 6.2 x86_64 注:本实验关闭 SELinux和IPtables防火墙. 管理IP地址 角色 备注 192.168.1.101 LVS主调度器(Ma ...

  8. Rsync文件同步服务器配置

    rsync 是一个Unix/Linux系统下的文件同步和传输工具.rsync是用 “rsync 算法”提供了一个客户机和远程文件服务器的文件同步的快速方法.可以用来做备份或镜像.一.配置文件rsync ...

  9. 【BZOJ1758】重建计划（点分治）

    题意: 给定一棵n个点的树,每条边有权值.求一条链,这条链包含的边数在L和U之间,且平均边权最大.N﹤=100000 思路:RYZ作业 二分答案再点分治,寻找是否有大于0且边数在L和U之间的链 f[i ...

  10. Delphi：ClientDataset+TDataSetProvider的数据保存问题

    看到一篇介绍ClientDataSet和TDataSetProvider,非常精彩,特此保存. ==================================================== ...