Doctype知识点总结
DOCTYPE是document type (文档类型) 的缩写。<!DOCTYPE >声明位于文档的最前面,处于标签之前,它不是html标签。主要作用是告诉浏览器的解析器使用哪种HTML规范或者XHTML规范来解析页面。
严格模式:又称标准模式,是指浏览器按照W3C标准来解析代码,呈现页面
混杂模式:又称为怪异模式或者兼容模式,是指浏览器按照自己的方式来解析代码,使用一种比较宽松的向后兼容的方式来显示页面。
1. 如何区分:
1). DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。
2). HTML5 没有 DTD(DTD的是W3C所发布的一个文档类型定义,简单的说,就是告诉浏览器你的这个HTML是根据那个标准写的,解析的时候用哪个标准解析。) ,因此也就没有严格模式与混杂模式的区别,HTML5 有相对宽松的语法,实现时,已经尽可能大的实现了向后兼容。
3). 严格 DTD ——严格模式
4). 有 URI 的过渡 DTD ——严格模式;没有 URI 的过渡 DTD ——混杂模式
2. 具体区别:
1). width不同
严格模式下,width是内容的宽度
混杂模式下,width是元素实际的高度
2). 在标准模式下,给span等行内元素设置width和height都不会生效,而在兼容模式下,会生效。
3). 在standards模式下,一个元素的高度是由其包含的内容来决定的,如果父元素没有设置高度,子元素设置一个百分比的高度是无效的。
4). 用margin: 0 auto,在标准模式下可以使元素水平居中,但在兼容模式下却会失效,(用text-align属性解决)
5). 兼容模式下table中的字体属性不能继承上层的设置, white-space:pre会失效,设置图片的padding会失效。
Doctype知识点总结的更多相关文章
- HTML5知识点总结
HTML5知识点总结(一) 一.HTML新增元素 1.IE9版本以下支持HTML5的方法 <!--[if lt IE9]> <script src="http://cdn. ...
- 【干货分享】前端面试知识点锦集02(CSS篇)——附答案
二.CSS部分 1.解释一下CSS的盒子模型? 回答一:a.标准的css盒子模型:宽度=内容的宽度+边框的宽度+加上内边具的宽度b.网页设计中常听的属性名:内容(content).填充(padding ...
- 【干货分享】前端面试知识点锦集01(HTML篇)——附答案
一.HTML部分 1.浏览器页面有哪三层构成,分别是什么,作用是什么? 构成:结构层.表示层.行为层分别是:HTML.CSS.JavaScript作用:HTML实现页面结构,CSS完成页面的表现与风格 ...
- css知识点整理
CSS是Cascading Style Sheets的简称,中文称为层叠样式表,用来控制网页数据的表现,可以使网页的表现与数据内容分离. 一.css引入的方式 1.行内样式:行内式是在标记的style ...
- CSS3知识点整理&&一些demo
css3能做什么 响应式开发的基础,然后能实现一些酷炫的效果咯. 以下案例纯css3实现,一点都没用js (入门简单,但是水很深) 叮当猫纯用css3做出 http://codepen ...
- 这些HTML、CSS知识点,面试和平时开发都需要 No1-No4
系列知识点汇总 这些HTML.CSS知识点,面试和平时开发都需要 No1-No4(知识点:HTML.CSS.盒子模型.内容布局) 这些HTML.CSS知识点,面试和平时开发都需要 No5-No7(知识 ...
- 【转】HTML5的小知识点小集合
html5的小知识点小集合 html5知识 1. Doctype作用?标准模式与兼容模式各有什么区别? (1).<!DOCTYPE>声明位于位于HTML文档中的第一行,处于<h ...
- 小型移动 webApp Demo 知识点整理
包括内容: css初始化.css全局设置.常用meat标签.rem适配.flex布局.相关技巧(手势库使用.多行截字.1像素边线.点击状态.placeholder居中等) reset 引用 norma ...
- 前端开发面试知识点大纲--摘自jackyWHJ
前端开发面试知识点大纲:HTML&CSS: 对Web标准的理解.浏览器内核差异.兼容性.hack.CSS基本功:布局.盒子模型.选择器优先级及使用.HTML5.CSS3.移动端适应 Ja ...
随机推荐
- [转]微信小程序实现图片上传功能
本文转自:http://blog.csdn.net/feter1992/article/details/77877659 前端: 微信开发者工具 后端:.Net 服务器:阿里云 这里介绍微信小程序如何 ...
- 网络层和arp协议
1:arp协议功能:获取mac地址 ----------------------在同一个局域网:发送端mac 接收端mac(FF:FF:FF:FF:FF:FF:FF) 源IP 目标IP 数据 - ...
- python接口自动化(二)--什么是接口测试、为什么要做接口测试(详解)
简介 上一篇和大家一起科普扫盲接口后,知道什么是接口,接口类型等,对其有了大致了解之后,我们就回到主题-接口测试. 什么是接口测试 接口测试是测试系统组件间接口的一种测试.接口测试主要用于检测外部系统 ...
- 5G网络与4G相比,有什么区别?
5G 是 2018 年移动通信领域的热词.从中兴的芯片卡脖事件,联想 5G 投票风波再到华为频遭威胁.这些事件都引起了大家对于 5G 的关注,那么 5G 到底是什么,它和 4G 有什么区别呢? 今天就 ...
- Google 工程师:为什么 CDN 对移动客户端加速“没有”效果
王者荣耀是近两年来比较火的手游,不少小伙伴都有玩过.玩这个游戏最怕的不是遇到猪一般的队友,也不是怕遇到神一样的对手.最让我们感到害怕和绝望的是,团战爆发时,而你 460 了.460 是一个玩家常用的词 ...
- Xcode 10 iOS12 "A valid provisioning profile for this executable was not found
问题:Xcode10 build 没问题,跑虚拟机也没问题,数据线连上run到真机上出现 Xcode 10 iOS12 "A valid provisioning profile for t ...
- 如何在ASP.NET Core程序启动时运行异步任务(3)
原文:Running async tasks on app startup in ASP.NET Core (Part 3) 作者:Andrew Lock 译者:Lamond Lu 之前我写了两篇有关 ...
- Android序列化
1.序列化的目的 (1)永久的保存对象数据(将对象数据保存在文件当中,或者是磁盘中 (2)通过序列化对象在网络中传递对象 (3)通过序列化对象在进程间传递 (4)在Intent之间,基本的数据类型直接 ...
- 利用GitLab webhook来实现触发Jenkins自动操作
本文针对如何设置GitLab以及Jenkins,实现每次GitLab上有提交事件的时候,都能触发Jenkins执行相应的操作,主要分为以下几个步骤: 1.新建GitLab测试用例 进入个人GitLab ...
- 通过 UI 管理 docker
Docker 正在被用在越来越多的场景中,对于不太习惯命令行工具的朋友来说,docker cli 用起来可能会比较吃力.本文笔者将介绍一个功能强大的 docker web 客户端:portainer( ...