响应图像和不同的pic分辨率

时间:2014-08-18 17:50:50

标签: javascript html css responsive-design slider

我有这个网站,正如你在索引页面上看到的那样,我们有80%的宽度和100%的容器,里面有一张图片。现在不同的图像及其分辨率存在问题,有些是拉伸的,有些是狭窄的。 我希望pic是全屏尺寸和80%宽度,并具有适当的宽高比。我可能需要一些javascript来裁剪图像?我需要一些关于如何做到这一点的见解。如果它具有裁剪功能并且可能具有80%宽度和100%高度

,则滑块也可以起作用

这是网址

http://tinyurl.com/otwocvz

1 个答案:

答案 0 :(得分:1)

尝试删除图像并将图像添加为header2背景。

.header2 {
position: absolute;
z-index: -1;
width: 100%;
height: 100%;
background-color: #CCC;
display: block;
background: url(http://leowd.com/wp-content/uploads/2014/08/leowd-umbrella-red2.jpg) no-repeat center center fixed;
background-size: cover; }