0

在我的网页中，我创建了一个 div 并向其中添加了“img-responsive”类。它工作得非常好并且可以完美扩展。但是，我需要在它上面添加一个按钮，到目前为止，我这样做的唯一方法是使用 CSS 属性“position:absolute”并定义它的位置。这确实有效，但是当我调整浏览器的大小时，该按钮不会随网页缩放并且隐藏在较小的屏幕上。我怎样才能解决这个问题？

这是我页面标题的图像：http: //postimg.org/image/xdols29nn/

这就是我的 div 的样子：

<div style="position:relative;" class="img-responsive" >
        <img src="images/mac2.png" width="1440" class="img-responsive" >
            <div>

                    <input style="position:absolute; left: 1130px; top:35px;"type="button" value="Button" href="#sidr" id="simple-menu">

            </div>

    </div>
4

1 回答 1

0

您是否尝试过这样做（制作您的按钮，然后制作您的图像宽度：100%）。这将迫使它们都以相同的宽度响应它们所在的任何容器，而无需任何定位。：

<div class='row'>
    <button class='btn btn-default' style='width:100%;'>button</button>
    <img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5MDAiIGhlaWdodD0iNTAwIj48cmVjdCB3aWR0aD0iOTAwIiBoZWlnaHQ9IjUwMCIgZmlsbD0iIzY2NiIvPjx0ZXh0IHRleHQtYW5jaG9yPSJtaWRkbGUiIHg9IjQ1MCIgeT0iMjUwIiBzdHlsZT0iZmlsbDojNDQ0O2ZvbnQtd2VpZ2h0OmJvbGQ7Zm9udC1zaXplOjU2cHg7Zm9udC1mYW1pbHk6QXJpYWwsSGVsdmV0aWNhLHNhbnMtc2VyaWY7ZG9taW5hbnQtYmFzZWxpbmU6Y2VudHJhbCI+U2Vjb25kIHNsaWRlPC90ZXh0Pjwvc3ZnPg==" style='width:100%;height:auto;' />
</div>

让我知道我是否走错了路。

于 2014-02-22T00:04:10.537 回答