我重复下面的 div 以使用 bootstrap 3 创建缩略图井网格。问题是 anchor 链接在 xs 上不起作用(按钮或图像链接均无效),但它们在 sm、md 和LG.
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
<div class="thumbnail" style="height:520px;">
<a href="/movies/4539/burnt-offerings-1976"><img src="https://s.ynet.io/assets/images/movies/burnt_offerings_1976/medium-cover.jpg" alt="Burnt Offerings"></a>
<div class="caption">
<h5>Burnt Offerings</h5>
<dl class="dl-horizontal hidden-xs">
<dt>Year</dt><dd>1976</dd>
<dt>Rating</dt><dd>6.5</dd>
<dt>Runtime</dt><dd>1:56</dd>
</dl>
<p><a href="/movies/4539/burnt-offerings-1976" class="btn btn-primary btn-sm btn-block">Download</a></p>
</div>
</div>
</div>
最佳答案
你的 ul.pager
涵盖了 col-xs
上的所有元素因此,为什么没有任何内容是可点击的。
这是一个想法:
在您的 ul.pager
上添加 z-index: 1;
在你的 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
上添加另一个你可以 Hook 的类 <div class="col-xs-12 col-sm-6 col-md-4 col-lg-3 item">
并做 .item { position: relative; z-index: 2; }
关于css - 链接在 bootstrap xs 上不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32996735/