Doctype作用?标准模式与兼容模式各有什么区别?
  DOCTYPE是document type(文档类型)的简写,用来告诉浏览器的解析器使用哪种HTML或XHTML规范解析页面。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。

知道多少种文档类型

HTML 4.01和XHTML 1.0规定了三种文档类型:Strict(严格)、Transitional(过渡)以及Frameset(基于框架)。

为什么HTML5只要写<!DOCTYPE HTML>

HTML 4.01 基于 SGML,需要对 DTD 进行引用,才能告知浏览器文档所使用的文档类型 。
HTML 5 不基于 SGML,因此不需要对 DTD 进行引用,但是需要 doctype 来规范浏览器的行为。
SGML是标准通用标记语言,简单的说,就是比HTML,XML更老的标准,这两者都是由SGML发展而来的。但是,HTML5不是的。

标准模式与兼容模式(怪异模式)各有什么区别?

Standards(标准)模式(也就是严格呈现模式)用于呈现遵循最新标准的网页,而Quirks(兼容)模式(也就是松散呈现模式或者怪异模式)用于呈现为传统浏览器而设计的网页。

标准模式的排版 和JS运作模式都是以该浏览器支持的最高标准运行。
兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。简单说就是尽可能的显示能显示的东西给用户看。

具体区别:
1.盒模型
  在严格模式中 :width是内容宽度 ,元素真正的宽度 = width;
  在兼容模式中 :width则是=width+padding+border

2.兼容模式下可设置百分比的高度和行内元素的高宽
    在Standards模式下,给span等行内元素设置wdith和height都不会生效,而在兼容模式下,则会生效。
    在standards模式下,一个元素的高度是由其包含的内容来决定的,如果父元素没有设置高度,子元素设置一个百分比的高度是无效的。

3.用margin:0 auto设置水平居中在IE下会失效
    使用margin:0 auto在standards模式下可以使元素水平居中,但在兼容模式下却会失效(用text-align属性解决)
    body{text-align:center};#content{text-align:left}

4.兼容模式下Table中的字体属性不能继承上层的设置,white-space:pre会失效,设置图片的padding会失效

Doctype作用?标准模式与兼容模式各有什么区别?的更多相关文章

  1. 前端面试题系列(1):doctype作用 标准模式与兼容模式

    1.doctype作用 <!DOCTYPE>声明位于HTML文档的第一行.处于<HTML>标签之前.告知浏览器的解析器用什么文档标准解析这个文档.DOCYTYPE不存在或格式不 ...

  2. DOCTYPE的作用以及标准模式和兼容模式的区别

    <!doctype>声明必须处于HTML文档的头部,在<html>标签之前,告知浏览器的解析器用什么文档标准解析这个文档.DOCTYPE不存在或格式不正确会导致文档以兼容模式呈 ...

  3. 说说html 的<!DOCTYPE>声明&标准模式与兼容模式

    我们都知道<!DOCTYPE>声明位于文档的最前面,处于<html>标签之前. <!DOCTYPE>声明不是html标签,它的作用:告知web浏览界面应该使用哪个h ...

  4. HTML学习笔记——DOCTYPE和DTD,标准模式和兼容模式

    主要涉及知识点: HTML与XHTML HTML与XHTML的区别 DOCTYPE与DTD的概念 DTD的分类以及DOCTYPE的声明方式 标准模式(Standard Mode)和兼容模式(Quirc ...

  5. 用meta name="renderer" content="webkit|ie-comp|ie-stand"来切换360双核安全浏览器的极速模式和兼容模式

    以下信息摘自360官方网站: 浏览模式:极速模式.兼容模式及IE9高速模式是360浏览器显示网页时使用的三种模式:极速模式表示极速模式兼容模式表示兼容模式IE9IE10模式表示IE9/IE10模式(仅 ...

  6. Doctype作用,标准模式与兼容模式的区别

    <!DOCTYPE>声明位于位于HTML文档中的第一行,处于 <html> 标签之前.告知浏览器的解析器用什么文档标准解析这个文档.DOCTYPE不存在或格式不正确会导致文档以 ...

  7. DOCTYPE声明作用?标准模式与兼容模式?

    <!DOCTYPE>文档声明是用来告诉浏览器使用哪种DTD,一般放在(X)HTML文档开头声明,用以告诉其他人这个文档的类型风格:DTD(文档类型定义)是一组机器可读的规则,它们指示(X) ...

  8. 360兼容模式==ie8 兼容模式下 span标签占位问题

    ie8 兼容模式 ie8 标准渲染 应付金额 穿位 错误代码 <span class="span_em">应付金额:<em><span style=& ...

  9. CSS hack 360浏览器 极速模式与兼容模式

    自动切换浏览器模式对于360浏览器7.1版本有效,8.1无效 <%@ Page Language="C#" AutoEventWireup="true" ...

随机推荐

  1. 从ruby实现时间服务器ntp同步功能也谈“逆向工程”

    本猫以前写asm和C的时候常常不忘"逆向"一把,后来写驱动的时候也用VM之类的搭建"双机"调试环境进行调试:也对于一些小的软件crack cd-key神马的不亦 ...

  2. android + php 后台开发

    android+php 安卓与服务器的数据交互 在我们进行android开发的时候,避免不了的要进行登录注册,个人信息获取,数据交互等等这一系列的操作.这样就需要进行android端与服务器端进行数据 ...

  3. Tihinkphp3.2整合最新版阿里大鱼进行短信验证码发送

    阿里大鱼最新下载地址:阿里大鱼SDK下载 或者从官网进行下载:阿里大鱼SDK官网下载 下载完成后,将压缩包内的api_sdk文件夹放到ThinkPHP\Library\Vendor目录下,修改文件名为 ...

  4. 听《津津乐道》ThinkPad专题节目有感

    自2011年使用Mac以来,就没怎么想过要再换一个windows使用,可是前几天听了<津津乐道>播客节目,主播朱峰讲了ThinkPad的使用经历,这个倒是让我回想起第一次见到IBM电脑时的 ...

  5. 数据库面试题目- ORACLE

    Posted on 2009-06-08 17:38 漠北的天空 阅读(110) 评论(0)  编辑 收藏 1.       列举几种表连接方式 Answer:等连接(内连接).非等连接.自连接.外连 ...

  6. 《Servlet与JSP核心编程》读书笔记

    这本书实际是我进入JavaWeb开发的入门书籍,而且是日常碰到一些技术问题需要确认时的参考书,前一段时间在解决一个他人的问题时,我突然发现我的第一遍阅读对这本书的内容的理解还不够透彻,所以又开始N多年 ...

  7. R语言学习 第十一篇:日期和时间

    R语言的基础包中提供了三种基本类型用于处理日期和时间,Date用于处理日期,它不包括时间和时区信息:POSIXct/POSIXlt用于处理日期和时间,其中包括了日期.时间和时区信息.R内部在存储日期和 ...

  8. 详解Java的Spring框架中的注解的用法

    转载:http://www.jb51.net/article/75460.htm 1. 使用Spring注解来注入属性 1.1. 使用注解以前我们是怎样注入属性的 类的实现: class UserMa ...

  9. Linux 系统化学习系列文章总目录(持续更新中)

    本页内容都是本人系统化学习Linux 时整理出来的.这些文章中,绝大多数命令类内容都是翻译.整理man或info文档总结出来的,所以相对都比较完整. 本人的写作方式.风格也可能会让朋友一看就恶心到直接 ...

  10. mysql 给表添加唯一约束、联合唯一约束,指定唯一约束的名字

    表结构 FIELD          TYPE          COLLATION       NULL    KEY     DEFAULT  Extra           PRIVILEGES ...