<!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默认有高宽度，但不推荐这种方式。
<!DOCTYPE>标签与table高度100% （转）的更多相关文章
- 9月6日表格标签（table、行、列、表头）（补）
一.<table> <table>代表表格标签. <table></table> 1.width 表示表格宽度,宽度表达方式有像素和百分比两种.网 ...
- IE6 IE7: div中table宽度100%导致的宽度问题
问题现象:定义了DOCTYPE的页面 当表格的内容比div的高度还要高时,div会出现滚动条,同时在IE6和IE7下会出现问题: IE6:此时table的100%宽度还是没有滚动条那是的宽度,出现滚动 ...
- 表格标签（table、行、列、表头）
表格标签 一.<table> <table>代表表格标签. <table></table> 1.width 表示表格宽度,宽度表达方式有像素和百分 ...
- html的<!DOCTYPE>标签初窥
<!DOCTYPE>标签必须放在整个html文档的第一行,之后一行就是从<html>标签开始,所有浏览器都支持<!DOCTYPE>标签. <!DOCTYPE& ...
- HTML <!DOCTYPE> 标签 布局引用的几种方法 行级元素与块级元素
HTML <!DOCTYPE> 标签 <!DOCTYPE html> <html> <head> <title>文档的标题</titl ...
- 相册 垂直居中; 水平居中. 1)宽度 大于高度, 宽度 100%; 2) 高度 大于 宽度 , 高度100%; getimagesize , list --->line-height , text-align, vertical-align, max-height, max-width
一: 效果: 1) 黑色 部分是 相框. 2) 图片 要实现 水平居中, 垂直居中 3) 如果 宽度 大于 高度 ,那么 宽度 100% ,如图1 , 高度 自适应 ,同时不能超过黑色相框的 高度 ; ...
- 聊一聊HTML <!DOCTYPE> 标签
一般一个基本html页面的结构,如下代码所示: <html> <head> <title>我是基本的页面结构</title> </head> ...
- Vue. 之 Element table 高度自适应
Vue. 之 Element table 高度自适应 使用vue创建table后,其高度自适应浏览器高度. 在创建的 el-table 中添加:height属性,其值为一个变量(tableHeight ...
- jsp中<!DOCTYPE>标签
今天写代码时遇到一个问题,定义了如下一个样式: .c_c1:hover td { background-color: #edf5ce;} <tr class="c_c1"&g ...
随机推荐
- 一个电脑的重装到java开发环境安装配置的全过程
刚拿到一台别人用过的电脑.看着c盘爆满,而且用了还是windows7操作系统,强迫症发作马上就准备重装系统. 之前换固态使用wepe制作U盘启动盘装系统的步骤和过程全部忘记的,贼尴尬. 同事都看不过眼 ...
- git reset命令使用
版本回退 当前有三个commit提交版本commit1commit2commit3Git必须知道当前版本是哪个版本,在Git中,用HEAD表示当前版本上一个版本是HEAD^,上上一个版本是HEAD^^ ...
- kibana从入门到精通-Kibana配置详解
配置 Kibana Kibana server 启动时从 kibana.yml 文件中读取配置属性.Kibana 默认配置 localhost:5601 .改变主机和端口号,或者连接其他机器上的 El ...
- 一直性hash解决扩容后的hash算法不用变
转自: http://blog.codinglabs.org/articles/consistent-hashing.html 摘要 本文将会从实际应用场景出发,介绍一致性哈希算法(Consisten ...
- 【学习笔记】深入理解async/await
参考资料:理解javaScript中的async/await,感谢原文作者的总结,本文在理解的基础上做了一点小小的修改,主要为了加深自己的知识点掌握 学完了Promise,我们知道可以用then链来解 ...
- PowerDesigner V16.5 安装教程以及汉化（数据库建模）
一.power designer是什么以及是干什么的? power designer是能进行数据库设计的强大的软件,是一款开发人员常用的数据库建模工具.分别从概念数据模型(Conceptual Dat ...
- Sublime Text3 远程 Linux
ctrl+shift+p快捷键 ,打开命令面板 搜索命令 Install Packages,选中,Enter 稍等几秒,重新出现了面板,搜索sftp插件,选中 Enter 显示安装成功,提示你如何使用 ...
- WebForm 【发送邮件】
C#实现简单的SmtpClient发送邮件 分析 需要什么 发送邮件 -- 发送内容 -- 接收邮件 流程(各功能都适用) 创建对象 -- ...
- Hive 和 Mysql
mysql是关系型数据库,通常用来增删改查,OLTP hive是数据仓库,依赖hdfs,一般只做查询,OLAP
- C#设计模式——简单工厂模式、工厂模式和抽象工厂模式
一:简单工厂模式 1:描述:简单工厂模式是由一个工厂对象根据接收到的消息决定要创建哪一个类的对象事例. 2:优点:工厂类中有相关逻辑判断,可以根据需要动态创建相关的对象事例,而客户端只需要告诉工厂类创 ...