zoukankan      html  css  js  c++  java
  • <!DOCTYPE>声明

    定义和用法

    <!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前。

    <!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。

    在 HTML 4.01 中,<!DOCTYPE> 声明引用 DTD,因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则,这样浏览器才能正确地呈现内容。

    HTML5 不基于 SGML,所以不需要引用 DTD。

    提示:请始终向 HTML 文档添加 <!DOCTYPE> 声明,这样浏览器才能获知文档类型。

     

    现在浏览器采用两种模式解析CSS :怪异(兼容)模式    标准(严格)模式;

    原因:在W3C标准出台之前,不同浏览器在页面的渲染上没有统一的规范,差异比较大,浏览器为了向前兼容,所以采用Quirks mode(怪异模式)

              W3C标准出台后,浏览器对页面渲染有了统一的标准,采用统一标准的就是Strict mode(标准模式)

    在标准模式中,浏览器根据规范呈现页面;在混杂模式中,页面以一种比较宽松的向后兼容的方式显示。

    一旦声明了<!DOCTYPE>就会采用标准模式,没有声明就会采用怪异模式

    名词解释:DTD 【 Document Type Definition】  作用:定义XML文档的合法构建模块

                     SGML(Standard Generalized Markup Language,即标准通用标记语言)http://wiki.mbalib.com/wiki/SGML

    以下内容作为了解(从网上找的,现在基本都是标准模式,只是作为拓展可以了解下):

    两种模式区别:

    区别是:

    1.在严格模式中 :width是内容宽度 ,元素真正的宽度 = margin-left + border-left-width + padding-left + width + padding-right + border-right- width +  margin-right;

    在怪癖模式中 :width则是元素的实际宽度 ,内容宽度 = width - ( padding-left + padding-right + border-left-width + border-right-width)

    2)可以设置行内元素的高宽
     
        在Standards模式下,给span等行内元素设置wdith和height都不会生效,而在quirks模式下,则会生效。
     
    3)可设置百分比的高度
     
        在standards模式下,一个元素的高度是由其包含的内容来决定的,如果父元素没有设置高度,子元素设置一个百分比的高度是无效的。
     
    4)用margin:0 auto设置水平居中在IE下会失效
     
        使用margin:0 auto在standards模式下可以使元素水平居中,但在quirks模式下却会失效,quirk模式下的解决办法,用text-align属性:
     
       body{text-align:center};#content{text-align:left}
     
    5)quirk模式下设置图片的padding会失效
     
    6)quirk模式下Table中的字体属性不能继承上层的设置
     
    7)quirk模式下white-space:pre会失效
     
     
    参考网站:https://blog.csdn.net/petrel_zhu/article/details/53088538
  • 相关阅读:
    【SpringMVC学习09】SpringMVC与前台的json数据交互
    【SpringMVC学习08】SpringMVC中实现文件上传
    【SpringMVC学习07】SpringMVC中的统一异常处理
    【SpringMVC学习06】SpringMVC中的数据校验
    【SpringMVC学习05】SpringMVC中的参数绑定总结——较乱后期准备加入 同一篇幅他人的参数绑定
    【SpringMVC学习04】Spring、MyBatis和SpringMVC的整合
    【SpringMVC学习03】SpringMVC中注解和非注解方式下的映射器和适配器总结
    【SpringMVC学习02】走进SpringMVC的世界
    【MyBatis】MyBatis分页插件PageHelper的使用
    【MyBatis学习15】MyBatis的逆向工程生成代码
  • 原文地址:https://www.cnblogs.com/sophiazhu/p/9272032.html
Copyright © 2011-2022 走看看