码迷,mamicode.com
首页 > 其他好文 > 详细

Doctype的作用以及严格模式和混杂模式的区别

时间:2017-07-05 23:01:46      阅读:148      评论:0      收藏:0      [点我收藏+]

标签:高度   像素   作用   标准模式   底部   单元格   4.0   html4.0   保留   

<!DOCTYPE>声明位于位于HTML文档中的第一行,处于 <html> 标签之前。告知浏览器的解析器用什么文档标准解析这个文档。
DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。
标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。
在兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。
HTML5 为什么只需要写 <!DOCTYPE HTML>?
HTML5 不基于 SGML,因此不需要对DTD进行引用,但是需要doctype来规范浏览器的行为(让浏览器按照它们应该的方式来运行);
而HTML4.01基于SGML,所以需要对DTD进行引用,才能告知浏览器文档所使用的文档类型。
严格模式和混杂模式区别它们有什么意义?
1、盒模型的解析,这应该是众所周知的问题了。混杂模式下会按照IE5.5的盒模型解析。而标准模式是按标准的盒模型解析。
2、当一个块元素div或一个单元格中包含的内容只有图片时,在标准模式下,不管IE还是标准,在图片底部都有3像素的空白。但在混杂模式下,
标准浏览器(Chrome)中div距图片底部默认没有空白。
(标准模式下的底部3像素空白,与img vertial-align的默认值baseline有关,其实大多数时候我们并不希望它保留空白,去除的方法也很简单,
设置vertial-align为一个不是baseline的合法值即可。)
3、在混杂模式下,表格中的字体不会继承它祖先元素(比如body,比如包含table的div)的字体样式。
4、在IE的混杂模式下,给inline元素设置高宽都有效。
5、在混杂模式下,IE和其他浏览器对百分比宽度的解析是不一样的。如果父级是行内块或者浮动或者有定位的元素,给子元素设置百分比宽度100%时,
IE的混杂会以父级的100%算(父级没有设置宽度,则再往上一层找),而标准浏览器是取决于内容的宽度。
6、在混杂模式下,当我们给一个元素设百分比高度,其他浏览器(正常,inline高度无变化,inline-block和block都会按百分比),
而IE是自适应到内容高度。
7、overflow溢出默认值的问题。标准模式下,溢出元素是溢出可见的,超出部分的内容呈现在它的包含元素外。在混杂模式下,
IE浏览器的溢出元素会自适应内容的尺寸。
 

Doctype的作用以及严格模式和混杂模式的区别

标签:高度   像素   作用   标准模式   底部   单元格   4.0   html4.0   保留   

原文地址:http://www.cnblogs.com/dongdongseven/p/7123674.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!