当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > 网页自动满屏实现代码

CSS样式表
网页布局教程:掌握CSS网页布局属性
WEB标准的CSS网页布局技巧5则
你怎么书写CSS代码?
CSS教程:表单元素不继承body的字体属性
调整CSS的方式给滚动条换色
CSS网页布局中表格制作实例
网页设计学习教程:CSS盒模型
网页制作学习教程:CSS Position
网页九宫格布局:应用透明的外圆角
CSS网页布局学习的参考诀窍
把网页按钮伪装成超链接
CSS教程:检验CSS书写是否标准合理
你的网页最好通过HTML校验和CSS校验
网页制作教程:CSS的好处
网页制作心得:分离之后怎么做?
CSS教程:数字和字母将容器撑大问题解决
CSS Sprites优化网页代码的方法
CSS实例:精简代码的兼容各浏览器的滑动门
CSS网页制作技巧:提高CSS可阅读性
英文教程:CSS的Float

CSS样式表 中的 网页自动满屏实现代码


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-11   浏览: 170 ::
收藏到网摘: n/a

<!-- /* Font Definitions */ @font-face {font-family:宋体; panose-1:2 1 6 0 3 1 1 1 1 1; mso-font-alt:SimSun; mso-font-charset:134; mso-generic-font-family:auto; mso-font-pitch:variable; mso-font-signature:3 135135232 16 0 262145 0;} @font-face {font-family:"Cambria Math"; panose-1:2 4 5 3 5 4 6 3 2 4; mso-font-charset:1; mso-generic-font-family:roman; mso-font-format:other; mso-font-pitch:variable; mso-font-signature:0 0 0 0 0 0;} @font-face {font-family:Calibri; panose-1:2 15 5 2 2 2 4 3 2 4; mso-font-charset:0; mso-generic-font-family:swiss; mso-font-pitch:variable; mso-font-signature:-1610611985 1073750139 0 0 159 0;} @font-face {font-family:新宋体; panose-1:2 1 6 9 3 1 1 1 1 1; mso-font-charset:134; mso-generic-font-family:modern; mso-font-pitch:fixed; mso-font-signature:3 135135232 16 0 262145 0;} @font-face {font-family:"\@宋体"; panose-1:2 1 6 0 3 1 1 1 1 1; mso-font-charset:134; mso-generic-font-family:auto; mso-font-pitch:variable; mso-font-signature:3 135135232 16 0 262145 0;} @font-face {font-family:"\@新宋体"; panose-1:2 1 6 9 3 1 1 1 1 1; mso-font-charset:134; mso-generic-font-family:modern; mso-font-pitch:fixed; mso-font-signature:3 135135232 16 0 262145 0;} /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {mso-style-unhide:no; mso-style-qformat:yes; mso-style-parent:""; margin:0cm; margin-bottom:.0001pt; mso-para-margin-top:0cm; mso-para-margin-right:0cm; mso-para-margin-bottom:.5gd; mso-para-margin-left:0cm; mso-para-margin-bottom:.0001pt; text-align:justify; text-justify:inter-ideograph; text-indent:10.0pt; mso-char-indent-count:2.0; mso-pagination:none; font-size:12.0pt; font-family:"Calibri","sans-serif"; mso-ascii-font-family:Calibri; mso-ascii-theme-font:minor-latin; mso-fareast-font-family:宋体; mso-fareast-theme-font:minor-fareast; mso-hansi-font-family:Calibri; mso-hansi-theme-font:minor-latin; mso-bidi-font-family:"Times New Roman"; mso-bidi-theme-font:minor-bidi; mso-font-kerning:1.0pt;} .MsoChpDefault {mso-style-type:export-only; mso-default-props:yes; font-size:12.0pt; mso-ansi-font-size:12.0pt; mso-bidi-font-size:12.0pt; mso-bidi-font-family:"Times New Roman"; mso-bidi-theme-font:minor-bidi;} .MsoPapDefault {mso-style-type:export-only; margin-bottom:0cm; margin-bottom:.0001pt; mso-para-margin-bottom:.5gd; mso-para-margin-bottom:.0001pt; text-align:center; text-indent:10.0pt; mso-char-indent-count:2.0;} /* Page Definitions */ @page {mso-page-border-surround-header:no; mso-page-border-surround-footer:no;} @page Section1 {size:595.3pt 841.9pt; margin:72.0pt 90.0pt 72.0pt 90.0pt; mso-header-margin:42.55pt; mso-footer-margin:49.6pt; mso-paper-source:0; layout-grid:15.6pt;} div.Section1 {page:Section1;} -->
网页自动满屏
以前可以搞个<table>,然后设它的height=”100%”,这样整个表格就充满了页面,再将内容放在这表格内,搞定。可是不知从什么时候开始,突然发现这个属性失效了。
跟头部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
这句有点儿关系。去掉也可以自动满屏,窗口有多大,window.document.body.offsetHeight就有多大。
保留这个头部,稍加变通,也可以满屏。
方法是在最外层加个DIV,如下:
<div id="divTest" style="width:100%;height:100%;position:absolute;">
注意这个;position:absolute; 一定要有,否则也不起作用。这个DIV就作为整个页面的容器。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body onload="LoadTabPage();">
<div id="divTest" style="width:100%;height:100%;position:absolute;">
……
</div>
</body> </html>