zoukankan      html  css  js  c++  java
  • <!DOCTYPE>标签与table高度100% (转)

    <!DOCTYPE>标签可声明三种DTD类型,分别表示严格版本、过渡版本以及基于框架的 HTML 文档。

    三种HTML文档类型:

    HTML 4.01 规定了三种文档类型:Strict、Transitional 以及 Frameset。

    a ) 如果需要干净的标记,免于表现层的混乱,用HTML Strict DTD类型:

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" " http://www.w3.org/TR/html4/strict.dtd">

    b )Transitional DTD 可包含 W3C 所期望移入样式表的呈现属性和元素. 如果用户使用了不支持层叠样式表(CSS)的浏览器以至于你不得不使用 HTML 的呈现特性时,用     Transitional DTD 类型:

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " http://www.w3.org/TR/html4/loose.dtd">

    c ) Frameset DTD 被用于带有框架的文档。除 frameset 元素取代了 body 元素之外,Frameset DTD 等同于 Transitional DTD:

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" " http://www.w3.org/TR/html4/frameset.dtd">

    三种 XML 文档类型:

    XHTML 1.0 规定了三种 XML 文档类型:Strict、Transitional 以及 Frameset。

    a ) 如果需要干净的标记,免于表现层的混乱,用XHTML Strict DTD类型:

         <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    b )Transitional DTD 可包含 W3C 所期望移入样式表的呈现属性和元素. 如果用户使用了不支持层叠样式表(CSS)的浏览器以至于你不得不使用 HTML 的呈现特性时,用     Transitional DTD 类型:

        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    c ) Frameset DTD 被用于带有框架的文档。除 frameset 元素取代了 body 元素之外,Frameset DTD 等同于 Transitional DTD:

        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

    XHTML 1就是HTML 4.01的XML化,是一种不向前兼容的格式。

    HTML 4.01 中的 doctype 需要对 DTD 进行引用,因为 HTML 4.01 基于 SGML。

    SGML规定了在文档中嵌入描述标记的标准格式,指定了描述文档结构的标准方法,目前在WEB上使用的HTML格式便是使用固定标签集的一种 SGML文档。

    有关浏览器工作模式大致可分为三种:Standarded Mode, Almost Standarded Mode及Quirks Mode。

    Standarded Mode最为严格,即页面要求最规范,最符合W3C标准,又称为Strict Mode;

    Almost Standarded Mode是当前使用最广泛的工作模式,是一种由不规范到规范过渡(其实它与Standarded Mode区别并不大,仅在图片显示及少量脚本解析上存在差异)。

    Quirks Mode是指浏览器模拟早期浏览器版本,为了适应早期页面中不规范的标签等;

    浏览器在加载页面时,首先根据文档对象类型定义来判断当前页面是应该使用哪种工作模式来渲染页面以达到页面定义者的预期效果。

    一个对象高度是否可以使用百分比显示,取决于对象的父级对象。Table在body之中,因此它的父级是body,而浏览器在标准模式下,是没有给body一个高度属性的,因此当设置height:100%;时,不会产生任何效果(内容根据高度自适应),而当给body设置了100%之后(相对于html标签),它的子级对象Table的height:100%便发生作用了,这便是浏览器解析规则引发的高度自适应问题。值得注意:Firefox中的HTML标签不是 100%高度,因此给两个标签都定义为height:100%;以保证两个浏览器下均能够正常显示。

    解决方案:

    (1)为<html>与<body>标签添加100%的高宽属性。

    (2)可直接删除<!DOCTYPE>定义,这样浏览器会工作在Quriks Mode下,body与html默认有高宽度,但不推荐这种方式。

  • 相关阅读:
    bzoj 4012: [HNOI2015]开店
    POJ 1054 The Troublesome Frog
    POJ 3171 Cleaning Shifts
    POJ 3411 Paid Roads
    POJ 3045 Cow Acrobats
    POJ 1742 Coins
    POJ 3181 Dollar Dayz
    POJ 3040 Allowance
    POJ 3666 Making the Grade
    洛谷 P3657 [USACO17FEB]Why Did the Cow Cross the Road II P
  • 原文地址:https://www.cnblogs.com/luoxiao/p/3457865.html
Copyright © 2011-2022 走看看