使用<!DOCTYPE>时,“height = 100%”不能在html中运行,我该如何解决?

前端之家收集整理的这篇文章主要介绍了使用<!DOCTYPE>时,“height = 100%”不能在html中运行,我该如何解决?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
当我使用带有“Docymenttype”的HTML时,我的HTML页面“Height = 100%”正在工作。

但是当我使用“Docymenttype”时,高度无法正常工作

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
  3. <head>
  4.  
  5. <Meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
  6. <title>New Page 1</title>
  7. </head>
  8.  
  9. <body>
  10.  
  11. <table cellpadding="0" cellspacing="0" width="11" height ="100%">
  12. <tr>
  13. <td height="100%" bgcolor="#008000">&nbsp;</td>
  14. </tr>
  15. </table>
  16.  
  17. </body>

我如何解决这个问题?

解决方法

添加DOCTYPE将您从 quirks mode切换到标准模式。在标准模式下,html和body元素不会默认为视口大小的100%(浏览器窗口);相反,他们只是需要遏制他们的孩子一样大。表高度为100%表示包含元素的100%,但只有包含表格内容所需的那么大。怪癖模式是老式浏览器的行为的模拟,其中html和body元素填充了视口。

解决这个问题,你只需要把它添加到你的文档中:

  1. <style>
  2. html,body { height: 100% }
  3. </style>

猜你在找的HTML相关文章