如何使div响应图像

时间:2015-07-22 06:28:49

标签: html css

您好我正在尝试开发一个网页。因为我应该在页面的中心放置一个图像。在该图像下方,我放置了一个div,以便通过点击该div来显示某些项目。我的问题是,当窗口大小缩小时,图像将变得响应,但不是那个div。我想让他们两个都有回应。这是我的代码

的index.html

<div class="container">
        <div class="row">
            <div class="col-lg-12" style="top:-125px;">
                <img id="i1" class="img-responsive" src="img/2.png" height="600" width="600" alt="">
                <div style="padding-left:45%;top:-250px;">
                    <div id="triangle-up"></div>
                </div>
            </div>
        </div>
    </div>

这是我的css

#triangle-up {

position: absolute;
bottom:0;
left: 46%; 
padding: 5px;
width: auto;
height: auto;
border-left: 60px solid transparent;
border-right: 60px solid transparent;
border-bottom: 67px solid grey;
}
.container
{
position: relative;
}

请帮我解决这个问题..

1 个答案:

答案 0 :(得分:0)

使用CSS将div的宽度设置为100%,将max-width设置为您不希望div增长的像素数量。