Question

我试图在bootstrap3中对img-responsive进行文本处理。它没有正常工作，因为当我做出“绝对”的时候。 css它不会响应。如何使图像上的按钮始终 apear并做出响应？

一些HTML

        <div class="container">
            <div class="row">
                <div class=" col-md-12 col-sm-12 col-xs-12">
                    <div class=" col-md-6  col-sm-12 col-xs-12 ">
                        <img class="left img-responsive" src="http://placehold.it/350x250" alt="">
                        <div class="btn btn-danger button-image">
                            DOWNLOAD
                        </div>
                    </div>
                    <div class=" col-md-6  col-sm-12 col-xs-12 ">

                        <img class="left img-responsive" src="http://placehold.it/350x250" alt="">
                        <div class="btn btn-danger button-image">
                            SEE MORE
                        </div>

                    </div>

                </div>
          </div></div>


        <div id="push"></div>

Bootply http://www.bootply.com/131025

Answer 1

从右向左更改：

.button-image{
position:absolute;
bottom:21px;
left: 130px;
width:100px;
height:30px;
}

您可能需要考虑使用百分比将其放置在div中，但要考虑不同的视口大小等...

img-responsive bootstrap 3上的响应按钮

1 个答案: