高手回答下自适屏问题吧！_html/css_WEB-ITnose

关于自适适应各种不同尺寸屏幕，不太懂，（百分百好像也可以，但要精算。。除了这种还有什么法子？）

俩台电脑，（台式，屏幕大约21寸，笔记本，14寸好像）
给出我个人一个小实例吧：
我仿一个网站，将人家背景图片拿来用！他的背景图片是1830*1650(是这个网站http://rappelz.eaglegamesea.com/)

我试过俩种方法

1：固定值，就是把宽高全部给出，但，会出现滚动横条的。
2:100% 这个不知道是不是我不会设置还是咋？ 只出现图片的一半。

所以，哎，不太懂自适应！，求高手耶！

回复讨论(解决方案)

100%

还有一句，我现在是在用笔记本，但是帮我朋友仿这个网站，他好像是台式噢

还有一句，我现在是在用笔记本，但是帮我朋友仿这个网站，他好像是台式噢
用相对布局，他用17 19寸，也就拉伸了，如果你想充满屏幕的话
不过一般不用这样，满足大部分人就行了，CSDN，这格子不就是固定宽度的吗，
显示器分辨率大两边空白就多，这是很正常的

嗯，我也明白满足大部分就OK了，但是，有一个必要（就是不出现横滚动条）
引用 2 楼  的回复:

还有一句，我现在是在用笔记本，但是帮我朋友仿这个网站，他好像是台式噢

用相对布局，他用17 19寸，也就拉伸了，如果你想充满屏幕的话
不过一般不用这样，满足大部分人就行了，CSDN，这格子不就是固定宽度的吗，
显示器分辨率大两边空白就多，这是很正常的

帮我做下范例。。亲， 是以上面给出的宽高做成背景。
引用 2 楼  的回复:

还有一句，我现在是在用笔记本，但是帮我朋友仿这个网站，他好像是台式噢

用相对布局，他用17 19寸，也就拉伸了，如果你想充满屏幕的话
不过一般不用这样，满足大部分人就行了，CSDN，这格子不就是固定宽度的吗，
显示器分辨率大两边空白就多，这是很正常的

这还有Demo呐，你知道宽度就行了，

800*600下，网页宽度保持在778以内，就不会出现水平滚动条，高度则视版面和内容决定。
1024*768下，网页宽度保持在1002以内，如果满框显示的话,高度是612-615之间.就不会出现水平滚动条和垂直滚动条。
在ps里面做网页可以在800*600状态下显示全屏，页面的下方又不会出现滑动条，尺寸为740*560左右
在PS里做的图到了网上就不一样了，颜色等等方面，因为ＷＥＢ上面只用到２５６ＷＥＢ安全色，而ＰＳ中的ＲＧＢ或者ＣＭＹＫ以及ＬＡＢ或者ＨＳＢ的色域很宽颜色范围很广，所以自然会有失色的现象.
页面标准按800*600分辨率制作，实际尺寸为778*434px 

800*600一般是老网吧大PP那种，就以1024*768为标准吧，宽最大为1002

拉伸（根据百分比来定制大小）
 吸附（四个方向中任意几个固定）
顺延（更具内容的多少自然排列）
多样式表（根据设备屏幕的大小准备不同的补充样式表）

最后 不要认为不同设备屏幕要有同样的显示 主体内容不变就ok了

基本就这样了

能说明么！~！
拉伸（根据百分比来定制大小）
 吸附（四个方向中任意几个固定）
顺延（更具内容的多少自然排列）
多样式表（根据设备屏幕的大小准备不同的补充样式表）

最后 不要认为不同设备屏幕要有同样的显示 主体内容不变就ok了

基本就这样了

这样去理解，背景图假如是：width:1024,height:900.你设置页面是100%,在1024*900分辨率的屏幕上会刚好，如果在1368*760上面背景图就会沿着横向，纵向重复（未设置其他css条件情况下）。一般不推荐用自适应的布局，不过导航和底部可以用自适应。就是因为自适应很难控制布局。

你可以设置布局方式为position: absolute;top:0px;left:0px;right:0px;bottom:0px;这样是全屏自适应的，然后在里面设置具体的布局方式就可以了，我做自适应的时候，都是这样做的。。。