<!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默认有高宽度,但不推荐这种方式。

<!DOCTYPE>标签与table高度100% (转)的更多相关文章

  1. 9月6日表格标签(table、行、列、表头)(补)

    一.<table> <table>代表表格标签.   <table></table> 1.width  表示表格宽度,宽度表达方式有像素和百分比两种.网 ...

  2. IE6 IE7: div中table宽度100%导致的宽度问题

    问题现象:定义了DOCTYPE的页面 当表格的内容比div的高度还要高时,div会出现滚动条,同时在IE6和IE7下会出现问题: IE6:此时table的100%宽度还是没有滚动条那是的宽度,出现滚动 ...

  3. 表格标签(table、行、列、表头)

    表格标签 一.<table> <table>代表表格标签.   <table></table> 1.width  表示表格宽度,宽度表达方式有像素和百分 ...

  4. html的<!DOCTYPE>标签初窥

    <!DOCTYPE>标签必须放在整个html文档的第一行,之后一行就是从<html>标签开始,所有浏览器都支持<!DOCTYPE>标签. <!DOCTYPE& ...

  5. HTML <!DOCTYPE> 标签 布局引用的几种方法 行级元素与块级元素

    HTML <!DOCTYPE> 标签 <!DOCTYPE html> <html> <head> <title>文档的标题</titl ...

  6. 相册 垂直居中; 水平居中. 1)宽度 大于高度, 宽度 100%; 2) 高度 大于 宽度 , 高度100%; getimagesize , list --->line-height , text-align, vertical-align, max-height, max-width

    一: 效果: 1) 黑色 部分是 相框. 2) 图片 要实现 水平居中, 垂直居中 3) 如果 宽度 大于 高度 ,那么 宽度 100% ,如图1 , 高度 自适应 ,同时不能超过黑色相框的 高度 ; ...

  7. 聊一聊HTML <!DOCTYPE> 标签

    一般一个基本html页面的结构,如下代码所示: <html> <head> <title>我是基本的页面结构</title> </head> ...

  8. Vue. 之 Element table 高度自适应

    Vue. 之 Element table 高度自适应 使用vue创建table后,其高度自适应浏览器高度. 在创建的 el-table 中添加:height属性,其值为一个变量(tableHeight ...

  9. jsp中<!DOCTYPE>标签

    今天写代码时遇到一个问题,定义了如下一个样式: .c_c1:hover td { background-color: #edf5ce;} <tr class="c_c1"&g ...

随机推荐

  1. Java并发编程之synchronized关键字

    整理一下synchronized关键字相关的知识点. 在多线程并发编程中synchronized扮演着相当重要的角色,synchronized关键字是用来控制线程同步的,可以保证在同一个时刻,只有一个 ...

  2. tomcat8 性能优化

    一.编辑配置文件:vim /opt/tomcat/conf/server.xml打开默认被注释的连接池配置:默认值: <!-- <Executor name="tomcatThr ...

  3. JVM笔记10-性能优化之高级特性

    一.垃圾回收器配置和 GC 日志分析 1.堆典型配置: 32位的操作系统限制堆大小介于1.5G到2G,64位操作系统无限制,同时系统可用虚拟内存和可用物理内存都会限制最大堆的配置. 堆空间分配典型配置 ...

  4. 使用Asp.Net Core MVC 开发项目实践[第二篇:EF Core]

    在项目中使用EF Core还是比较容易的,在这里我们使用的版本是EF Core 2.2. 1.使用nuget获取EF Core包 这个示例项目使用的是SQLSERVER,所以还需要下载Microsof ...

  5. Docker入门之一Docker在Window下安装

    最近这几年,各个大公司都在打造自己的云平台,什么阿里云,华为云,腾讯云等等云,以及各种的微服务架构,其实在这当中Docker容器技术算是一个很重要的角色. 一.下载 在下载之前首先检查一下自己的电脑是 ...

  6. CASE函数

    -> 使用类似switch-case与if-else if -> 语法 •case [字段] •    when 表达式 then 显示数据 •    when 表达式 then 显示数据 ...

  7. WebFrom 【母版页】

    ASP.NET中母版页作用 一是提高代码的复用(把相同的代码抽出来) 二是使整个网站保持一致的风格和样式. 母版页存在就一定要有内容页的存在,否则母版页的存在就没有了意义. .master 一.添加母 ...

  8. 近期ASP.NET问题汇总及对应的解决办法

    1. 使用SQL统计一个字符串中指定字符的个数,示例(统计0的个数): ','')) 2. 使用Forms认证,客户端本地时间不对无法登陆系统,解决办法: FormsAuthentication.Re ...

  9. [android] 安卓消息推送的几种实现方式

    消息推送的目的:让服务器端及时的通知客户端 实现方案 轮询:客户端每隔一定的时间向服务器端发起请求,获得最新的消息 特点:如果用在最新新闻通知上,效率就有点低了,技术简单,好实现 应用场景:服务器端以 ...

  10. mysql 8小时超时设置

    1.打开MySQL配置文件 2.添加 interactive_timeout=31536000wait_timeout=31536000 3.重新启动服务 打开MySQL命令行界面查看设置是否成功