简单方法实现网页自动适应任何分辨率任何窗口大小

作者：网页修行来源：51js 时间：2008-09-13 19:28:00　

简单方法实现网页自动适应任何分辨率任何窗口大小(只适用于IE)

<!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"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>IE6</title><style>*{padding:0;margin:0;}#AllBody{width:1004px;margin:0 auto;}#Top{background-color:#154BA0;height:50px;}#Left{width:200px;background-color:#9FC8DF;float:left;height:500px;}#Right{width:804px;background-color:#ffe;float:left;height:500px;}#Bottom{clear: both;float: none;background-color:#86B9D6;height:150px;}</style><script type="text/javascript">function WinOnResize(){document.getElementById("AllBody").style.zoom=parseInt((document.documentElement.clientWidth)/1004*100) + "％";}</script></head><body onresize="WinOnResize()" onload="WinOnResize()"><div id="AllBody"><div id="Top"></div><div id="Left"></div><div id="Right"></div><div id="Bottom"></div></div></body></html>

<!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"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>IE6</title><style>*{padding:0;margin:0;}#AllBody{width:1004px;margin:0 auto;}#Top{background-color:#154BA0;height:50px;border-bottom:2px solid #006;}#Left{width:200px;background-color:#9FC8DF;float:left;height:500px;}#Right{width:800px;background-color:#ffe;float:left;height:500px;border-left:2px solid #039;border-right:2px solid #039;}#Bottom{border-top:2px solid #006;clear: both;float: none;background-color:#86B9D6;height:150px;}</style><script type="text/javascript">function WinOnResize(){document.getElementById("AllBody").style.zoom=parseInt((document.documentElement.clientWidth)/1004*100) + "％";}</script></head><body onresize="WinOnResize()" onload="WinOnResize()"><div id="AllBody"><div id="Top">此区域内有很多精致布局</div><div id="Left">此区域内有很多精致布局</div><div id="Right">此区域内有很多精致布局</div><div id="Bottom">此区域内有很多精致布局</div></div></body></html>

标签：自适应,布局,分辨率

投稿

简单方法实现网页自动适应任何分辨率任何窗口大小

猜你喜欢

asp.net和php的区别点总结

零基础写python爬虫之抓取百度贴吧并存储到本地txt文件改进版

python自动发邮件库yagmail的示例代码

pytorch VGG11识别cifar10数据集(训练+预测单张输入图片操作)

详解MySQL中存储函数创建与触发器设置

miniconda3介绍、安装以及使用教程

Python-OpenCV基本操作方法详解

MySQL手动安装方法与中文解决方案

深入分析JavaScript 事件循环(Event Loop)

Python实现subprocess执行外部命令

兼容FF的图片切换代码

python爬虫开发之使用Python爬虫库requests多线程抓取猫眼电影TOP100实例

Python Datetime模块和Calendar模块用法实例分析

解决SQL Server的“此数据库没有有效所有者”问题

ASP.net如何连接SQL SERVER 2012数据库

不成熟的标准化是我们唯一惧怕的

Python列表推导式与生成器表达式用法示例

python select.select模块通信全过程解析

详解如何在python中读写和存储matlab的数据文件(*.mat)

Python通过Manager方式实现多个无关联进程共享数据的实现