如何设定自适应网页在PS中制作效果图时的尺寸？

新闻资讯发布时间2014.4.10.浏览数：1566

【如何设定自适应网页在PS中制作效果图时的尺寸？】你的网页需要适应一下屏幕： 1920*1080 【21.5宽屏】 1024*768 【标准屏幕】 600*1024【平板屏幕】 320*480【手机屏幕】则，你需要设计两个尺寸即可，1440*900【小宽屏，内容限制1000*600】，600*1024【平板竖版，根据设备UI限......英文网站建设www.gz3go.com三行网络公司为您详细介绍 - 请往下阅读》

如何设定自适应网页在PS中制作效果图时的尺寸？

你的网页需要适应一下屏幕：
1920*1080 【21.5宽屏】
1024*768 【标准屏幕】
600*1024【平板屏幕】
320*480【手机屏幕】
则，你需要设计两个尺寸即可，1440*900【小宽屏，内容限制1000*600】，600*1024【平板竖版，根据设备UI限制区域】，这样，一个横版，一个竖版即可（共用内容可以制作成模板模块，效果图的处理会快一些）。

通常来说，做电脑端的页面，内容限制为960或1200，这样的效果图在各个界面上看起来都不错（1920宽度的话，两侧的白边很大，1024的时候又太窄），浏览器打开效果图，刚好模拟最终效果。

手持设备的话，因为是竖屏，因此设计一个版面即可，手持界面中，通常宽度不做限制，以充分利用屏幕的宽度，高度为自适应，根据宽度，内容的高度自动调整，而且，在制作静态页的时候，也是使用百分比来定义页面的尺寸。
实现图片大小自适应可以用JavaScript实现也可以使用css实现，我们看看css实现方法，在中添加如下代码：
　　img{ max-width:650px;width;expression(this,width>650&&this.width>this.height? 650px:'auto';)max-height:1650px;heiht;expresion(this.height>1650 ? 1650px:'auto');}
以上代码就是如果图片超过650px就会自动缩小到650px，从而不影响页面效果。