无法获得图像以拉伸全宽

时间:2013-05-24 04:34:59

标签: html css image web

我一直想让背景图像在屏幕上拉伸以适应屏幕,所以我没有决定只将其添加为图像。下面是我想要完成的图像。我已经清除了该部分的所有CSS和HTML,并希望从头开始。非常感谢帮忙。 www.jobspark.ca

enter image description here

2 个答案:

答案 0 :(得分:1)

您的父容器已经固定宽度为960px。如果更改容器宽度,将影响整个设计。最好试试我的下面的代码。使位置绝对是你的形象,你可以伸展

.image-block-outer-wrapper{
     height:338px;
 }
.image-block-wrapper{
     position:absolute:
     //align this div using margin
}
 .image-block-wrapper img{
  width:1200px;
   //or increase original image width by photoshop and set width here whatever you want
  }

答案 1 :(得分:0)

如果您希望图片在页面宽度上拉伸,并且乐意按比例尝试图像高度比例 -

.image-block-wrapper {
    width:100%;
    display:block;
}
.image-block-wrapper img {
    width:100%;
    height:auto;
}

请确保" image-block-wrapper" element不嵌套在具有固定宽度的任何其他元素中。此外,标签不应指定宽度和高度属性。