今天在搭前端的時候草冈,用到bootstrap框架,但是遇到一個問題:
使用縮略圖的時候,里面的文字都溢出來了蝙砌。
代碼如下:
<div class="col-md-4 col-sm-6 item">
<div class="thumbnail">
![](img/001.jpg)
<div class="caption">
<h3>Thumbnail label</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>
<p>
<a href="#" class="btn btn-primary" role="button">Button</a>
<a href="#" class="btn btn-default" role="button">Button</a>
</p>
</div>
</div>
</div>
找了很久不知道怎么辦阳堕。然后找了一個同樣是瀑布流的網(wǎng)站F12看了一下別人的代碼。發(fā)現(xiàn)別人caption
里面是span而不是p择克。然后我改了一下恬总。
代碼如下:
<div class="col-md-4 col-sm-6 item">
<div class="thumbnail">
<img src="" alt="" >
<div class="caption">
<h3>Thumbnail label</h3>
<span>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>
<a href="#" class="btn btn-primary" role="button">Button</a>
<a href="#" class="btn btn-default" role="button">Button</a>
</span>`
</div>
</div>
</div>
改完后明顯把溢出部分裝進(jìn)去了。
可能是p標(biāo)簽換行之類某些屬性引起的肚邢?壹堰?不太清楚。
記錄骡湖,留待探究缀旁。