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 ...
随机推荐
- 微信小程序客服消息实时通知之最佳实践
我们做微信小程序开发的都知道,只要在小程序页面中添加如下代码即可进入小程序的客服会话界面: <button open-type="contact" >联系我们</ ...
- 【STM32H7教程】第3章 STM32H7整体把控
完整教程下载地址:http://forum.armfly.com/forum.php?mod=viewthread&tid=86980 第3章 STM32H7整体把控 初学STM32H7一 ...
- 一文让你明白Redis主从同步
今天想和大家分享有关 Redis 主从同步(也称「复制」)的内容. 我们知道,当有多台 Redis 服务器时,肯定就有一台主服务器和多台从服务器.一般来说,主服务器进行写操作,从服务器进行读操作. 那 ...
- [Swift]动态变化顶部状态栏(statusBar)的颜色
顶部状态栏(statusBar)的两种样式: (1).default 样式:黑色. (2).light 样式:白色 一.无导航栏情况 如果没有使用导航控制器 UINavigationControlle ...
- [翻译]Java排错指南 - 5 确定崩溃何地发生
原文地址: https://docs.oracle.com/javase/8/docs/technotes/guides/troubleshoot/crashes001.html 这几天公司其他组遇到 ...
- 《HelloGitHub》第 27 期
公告 网站新增了简单的搜索功能,可以通过项目名称或地址搜索.查看项目.欢迎star和推荐项目,我们一只在路上,希望志同道合者加入进来. 现招募专栏负责人: C# Java <HelloGitHu ...
- DotNetCore跨平台~关于appsettings.json里各种配置项的读取
回到目录 对于dotnet Core来说,依赖注入的集成无疑是最大的亮点,它主要用在服务注册与注入和配置文件注册与注入上面,我们一般会在程序入口先注册服务或者文件,然后在需要的地方使用注入即可,下面主 ...
- Springboot整合Elastic-Job
Elastic-Job是当当网的任务调度开源框架,有以下功能 分布式调度协调 弹性扩容缩容 失效转移 错过执行作业重触发 作业分片一致性,保证同一分片在分布式环境中仅一个执行实例 自诊断并修复分布式不 ...
- Centos7+LVS-NAT+apache实验
一.简介 1.理论已经在上一篇博客简述,不了解得可以看看 https://www.cnblogs.com/zhangxingeng/p/10497279.html 2.LVS-NAT优缺点复习 关于这 ...
- sublime text3插件增强侧边栏的功能文件的复制粘贴
快捷键ctrl + shift +p 输入 install package 回车,调出插件搜索器, 在搜索栏中输入 SideBarEnhancements 回车安装插件. 在侧边栏中的各种操作功能增 ...