泉州V23网络为您的企业打造精品网站:  800元起"网站建设+精美网页设计+搜索引擎推广"服务!! 7*24咨询:13559567956
网站建设客户中心联系我们网站地图
 
V23首页网站制作网站推广域名空间付款方式联系我们
网站建设相关文章

网页不同分辨率的研究

作者:拼音 

我对显示分辨率,影响页面显示有些研究【欢迎讨论】 

大家一定在设计网面时,苦恼过不同分辨率下显示的问题 

不论你喜欢打表格,还是运用图层,或者利用框架以及帧『内联帧』, 
当你在800×600下完成创作,1024×768下就会错位,或出现左对齐 

1.如果你喜欢打表格,解决的办法就很简单了,只要把最外边的<table>水平局中即可 
如果你处理不好单元格,就把最外边的<table>的width设成"768"[针对800×600而言] 
这样你的网页在800×600满屏,1024×768就水平局中了,如果想1024×768下也满屏 
你只要把最外边的<table>的width设成"100%" ... ... 

说明:层,其实你可以把他看做是绝对定位标记区域,标记为<div></div> 

2.如果你喜欢运用图层,【我很喜欢,而且极爱】,居中问题就是一个大问题 
http://www.51goeuro.com/ 就是例子 
图层的好处就是想怎么放就怎么放,比表格灵活的多,再者众多的动态页面技术javascript 
的运用都涉及到了层的概念,页面中表格与层的混合运用,在很多知名网站都可见其踪影 
因为是绝对定位的,【相对于浏览窗口0.0坐标】所以由于客户端分辨率的设置不同,显示时 
就会出现错位问题。 

我的方法是:利用子层与父层的关系解决,具体细节请看下面的代码: 
<html> 
<head> 
<title>New Page 1</title> 
</head> 
<body> 
<div ID="blockdiv" style="position: absolute; top: 0; left: 0; width: 780; height: 26"> 
<table border="0" width="100%" bgcolor="#00FF00" height="100%" cellspacing="0" cellpadding="0"> 
<tr> 
<td width="100%" height="13"> 
<div style="position: absolute; left: 100; top: 75; width: 54; height: 23"> 
aaaa 
</div> 
<div style="position: absolute; left: 172; top: 178; width: 54; height: 23"> 
bbbb 
</div> 
</td> 
</tr> 
</table> 
</div> 

<script language="javascript"> 
<!-- 
var a 
ie4=(document.all)?true:false 
if(ie4) block=blockdiv.style 
a=screen.width 
if (a=="1024") 

alert(block.left); 
block.left=112; 


if (a=="800") 

{ alert(block.left); 
block.left=0; 

--> 
</script> 
</body> 
</html> 

3.至于框架,我有一个笨方法,是利用内联帧<IFRAME></IFRAME>把框架的索引页放在里面 
在外面放一个合适的<table> 
具体细节请看下面的代码:<html> 

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<meta name="GENERATOR" content="Microsoft FrontPage 4.0"> 
<meta name="ProgId" content="FrontPage.Editor.Document"> 
<title>New Page 2</title> 
</head> 

<body> 

<div align="center"> 
<center> 
<table border="0" width="780" height="600" cellspacing="0" cellpadding="0"> 
<tr> 
<td width="100%"> 
<p align="center"> 
<IFRAME src="你的框架页.htm" width="780" height="600"> </IFRAME> 
</td> 
</tr> 
</table> 
</center> 
</div> 

</body> 

</html> 

如果各位仁兄还有更好的方法,请写信给我yanto@163.com 

caver