<!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 ...
随机推荐
- TCP/IP 笔记 - 防火墙和网络地址转换
防火墙是位于内部网和外部网之间的屏障,是系统的第一套防线,作用是防止非法用户的进入. 网络地址转换是一种IP数据包通过路由器或防火墙时通过重写来源IP地址或目的地址的技术,可以用来隐藏或保护内部网络, ...
- angular学习笔记-angular中怎么获取dom元素
步骤分解: 第一步:给要获取的元素一个ng-model变量,并且绑定事件啦! <div class="home" ng-model="dirName" n ...
- Java 的字节流文件读取（二）
接着上篇文章,我们继续来学习 Java 中的字节流操作. 装饰者缓冲流 BufferedInput/OutputStream 装饰者流其实是基于一种设计模式「装饰者模式」而实现的一种文件 IO 流,而 ...
- MATLAB中eig的作用
MATLAB中eig的作用 eig Find eigenvalues and eigenvectors 返回矩阵的特征值和特征向量; [V,D] = eig(A) D是特征值 V特征向量 例 ...
- 通过kubernetes构建ela服务
一.kubernetes 通过yaml 创建pod与service apiVersion: extensions/v1beta1 kind: Deployment metadata: name: el ...
- SQL Server 创建和修改数据表
一.CREATE语句(创建) 1.创建DataBase 1.CONTAINMENT SQL Server 2012 新功能 , 默认值是OFF .(太高级 书上也没有详细介绍). 2.ON ON用于两 ...
- 关于Ajax的get与post浅分析，同步请求与异步请求，跨域请求；
Ajax局部异步刷新全称ASynchronous JavaScript And XML.使用Javascript代码获取服务器的数据,Ajax当中有两个请求方法,一个是get方法,一个是post请求方 ...
- 在EXT框架中，使用JS文件设置UEditor文本框，出现新增内容很多，页面变型，不出现滚动条，导致无法进行操作。
找到UEditor的配置文件:ueditor.config.js(这是我的项目的UEditor的配置文件名) 找到参数设置 autoHeightEnabled 是否自动增长参数,默认为TRUE 当默认 ...
- 微信小程序 数组索引 data-“”解释
按照官方最新文档循环的方式,索引值是以 wx:for-index="index" 方式写的, 以 parseInt(event.currentTarget.dataset.i ...
- css选择器：基本选择器
基本选择器 1.通用元素选择器 *表示应用到所有的标签. *{ padding:0px; margin:0px; } 2.元素/标签选择器 匹配所有p标签的元素 p{ color:red; backg ...