Question

PHP网页首页图片显示自适应屏幕分辨率的问题 网页CSS问题

我做的首页的主图是1920PX的，如果屏幕分辨率1440*900显示是正常的，但是在XP 1024*768分辨率的时候就显示不全，请教大侠该如何设置CSS，让主图也可以适应不同的分辨率，,详细请看图,

屏幕分辨率是1024的时候主图显示不全

屏幕分辨率为1440*960的时候就没有问题

网页源码

CSS源码





Answer 1

长度单位使用百分比是自适应常用做法，图片的长度单位不使用百分比则自动根据父元素可用空间进行布局，当可用空间小于图片实际大小时就会自动对图片进行裁剪（裁剪的结果就是显示不全）。

解决的方法：给图片（img）的宽度加上百分比进行控制（100%）。

可能出现的情况： 

1. 图片大小不一。【解决：控制所有图片的实际大小必须一致，这样经过缩放之后才会大小一致】。

Answer 2

如果用背景图，就设置background-size:cover;
如果不用背景图就设置 img{width:100%}

Answer 3

给图片设置width：100%；

Answer 4

代码图片是html的代码。css的呢？把blist这个class的代码贴出来。

Answer 5

可以把宽度设置成100%

追问

把哪个CSS里面加上width:100%;
我是新学的，麻烦说的详细一点，谢谢啊

追答

在.blist img{},大括号里面，给图片定下位，指定下宽度高度

追问

blist img{text-align:center; width:100%; height: 570px;}这样可以吗？

追答

可以

追问

不行，整个都变形了。。。

追答

那里面加一个position:relative试试

追问

也还是不行。。。加上position:relative后图片不变形了，但是还是显示不全

追答

那你把banner这个div也指定一个宽度,在。在.banner里面加一个

追问

不行，没有变化

追答

额，刚才没看明白问题，你是想去掉1024*768分辨率时候的滚动条是吧？那你看下body的参数