<!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 ...
随机推荐
- await和async在一般处理程序中的使用
写在前面 有个小项目,前端使用的html页面,那服务端的业务处理就采用最简单的一般处理程序了,之前一直在用,觉得一直用一种方式,确实挺蛋疼的,之前也有了解过async和await的内容.就想着自己折腾 ...
- Android FileObserver 实现原理(inotify)
目录 0x0前言 0x01 FileObserver 使用实例 0x02 FileObserver 实现原理 0x04 完整Demo下载地址 0x0前言 之前在分析某个Android平台加固壳子的时候 ...
- h5活动页开发总结记录
前几天在做h5活动页面的时候,有这样一个需求 上面的活动排行点击查看历史排行数据,弹出日期选择框,如下图 点击要查看的日期排行数据,这里需要对还没到的日期做处理,让用户不能选择,只可选择今天或者之前的 ...
- 跨域请求中预检请求options之坑
一.前言 因为跨域请求,浏览器可能(后面讲)会发送一次options请求,如果处理不好,跨域还是会gg的. 之前很少涉及跨域,涉及也是简单请求(下面阮老师文章中区别热简单请求和复杂请求),所以基本不会 ...
- [HEOI2017] 寿司餐厅 + 最大权闭合子图的总结
Description 太长了自己看叭 点这里! Solution 先学一波什么叫最大权闭合子图. 先要明白什么是闭合子图,闭合子图就是给定一个有向图,从中选择一些点组成一个点集V.对于V中任意一个点 ...
- SpringBoot入门之基于XML的Mybatis
上一博客介绍了下SpringBoot基于注解引入Mybatis,今天介绍基于XML引入Mybatis.还是在上一篇demo的基础上进行修改. 一.Maven引入 这个与上一篇的一样,需要引入mybat ...
- SpringMVC+SpringJdbc+SQLServer+EasyUI增删改查
前言 前天用SpringJdbc连接了一把SQLServer,早上起来用SpringMVC+SpringJdbc+EasUI写了个增删改查的demo,主要是熟悉下SpringMVC相关知识点,如vie ...
- Java的第6天，学习运算符
提到运算符我们就会想起 加 减 乘 除: Java中的一些运算符:关系运算符.逻辑运算符.赋值运算符.和条件运算符: 其中算术运算符有:+ , - , * , \, % ,++, -- ; + , - ...
- 如何在UWP中统一处理不同设备间的页面回退逻辑
已经有一段时间没有写博客来记录自己的学习点滴了.现在回想起来确实有些惭愧,期间经历了一些事情,到目前为止算是平息了,是时候该收收心来充实自己了. 在本篇缪文中,楼主打算给UWP开发的初学者讲述一个在开 ...
- HTML常用标签及属性
标签格式 格式: 双边:<标签名 属性1="值1" 属性2='值2' 属性3=值3>内容</标签名> 单边:<标签名 属性1="值1&quo ...