2016-01-13 49 views
1

目前我在引导程序中使用media-object的默认css如何我想知道如何我可以实现我的音频在移动图像下的效果。移动图片上面的内容在手机上

它现在的样子。 Demo

我想要它的样子。 Demo2

我目前的HTML是。

<div class="media"> 
    <a class="pull-left">  
     <img class="media-object" height="150" width="150" src="<?php $feat_image = wp_get_attachment_url(get_post_thumbnail_id($post->ID)); echo ''.$feat_image.''; ?>"> 
    </a> 
    <div class="media-body"> 
     <header class="section-header"> 
     <h2 itemprop="name"><a href="http://www.example.com/singles"><?php the_title(); ?></a></h2> 
     <div class="stripe-dotted"></div> 
     </header> 
     <p><?php the_content(); ?></p> 
    </div> 
</div> 

回答

1

我不知道使用媒体对象。我会这样做的简单方法是只使用cols。你可以有任何你想要你的列大小定期显示,然后在手机上,确保他们都占用了整个12列。

<div class="col-xs-12 col-md-6"> 
    image 
</div> 
<div class="col-xs-12 col-md-6"> 
    title and controls 
</div>