Bootstrap:在缩略图的右下角添加一个按钮链接

use*_*964 3 css thumbnails twitter-bootstrap

我想做那样的事情:

在此输入图像描述

现在,我正在使用保证金,但我确信有一些"干净"的方法可以做到这一点......:http: //jsfiddle.net/vXMMA/445/

<ul class="media-grid">
  <li>
    <a href="#">
        <img class="thumbnail" src="http://placehold.it/140x90" alt=""/>
    </a>
    <a href="#" class="btn" style="margin-left:-23px;margin-top:67px;">+</a>
  </li> 
  <li>
    <a href="#">
        <img class="thumbnail" src="http://placehold.it/140x90" alt=""/>
    </a>
    <a href="#" class="btn" style="margin-left:-23px;margin-top:67px;">+</a>
  </li>       

</ul>
Run Code Online (Sandbox Code Playgroud)

小智 8

这个怎么样

<ul class="media-grid">
  <li>
    <a href="#" style="position:relative;">
        <img class="thumbnail" src="http://placehold.it/140x90" alt=""/>
        <button class="btn" style="position:absolute;bottom:5px;right:5px;margin:0;padding:5px 3px;">+</button>
    </a>
  </li> 
  <li>
    <a href="#" style="position:relative;">
        <img class="thumbnail" src="http://placehold.it/140x90" alt=""/>
        <button class="btn" style="position:absolute;bottom:5px;right:5px;margin:0;padding:5px 3px;">+</button>
      </a>
  </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/xKrXn/1/