Bootstrap 3按列大小调整的图像

Question

仅使用CSS就可以轻松实现,但我无法通过使用Bootstrap来弄清楚如何使用它.

我希望有一个图像,文本环绕它,向左或向右浮动.但是我想要md和lg大小的屏幕为3列宽,并填充单列为xs和sm大小的屏幕.

所以在更大的屏幕上,这样的事情(这里最糟糕的草图):

现在,我有点工作......虽然它似乎只跨越2列,但我不确定原因:

<div class="row">
  <div class="col-md-10 col-md-offset-1">
    <div class="row">
      <h2>About Them Guys</h2>
      <p class="intro">Home is where you hang your hat.  Flank shank bacon, fatback boudin ham tongue beef ribs pig brisket pancetta frankfurter. Jerky pig biltong, chicken hamburger swine corned beef beef ribs beef jowl.</p>

      <div class="col-md-11 col-md-offset-1">

       <p><img src="http://img690.imageshack.us/img690/5169/36ng.png" class="col-md-3 img-responsive pull-left" alt="" />Bacon ipsum dolor sit amet short loin jerky salami sausage, hamburger t-bone doner filet mignon sirloin beef. Tail short ribs jerky leberkas prosciutto pastrami fatback jowl turkey t-bone bacon. Hamburger tail tri-tip, ribeye ham hock leberkas meatball pig short ribs jerky meatloaf. Flank shank bacon, fatback boudin ham tongue beef ribs pig brisket pancetta frankfurter. Jerky pig biltong, chicken hamburger swine corned beef beef ribs beef jowl. Kevin cow turducken, pancetta fatback swine pig boudin ball tip kielbasa venison. Pig salami capicola chuck pancetta pork.</p>

      </div>
    </div> <!--row-->
  </div> <!--col offset-->
</div> <!--row-->

如果整个段落被col-md-3列偏移,那么计算第一列的图像偏移为"1"？如果我使用col-md-4它然后它跨越3列 - 想要确保有一些我不缺少的东西.

谢谢!

Answer 1

这应该有效

<div class="row">
      <div class="col-md-10 col-md-offset-1">
        <div class="row">
          <h2>About Them Guys</h2>
          <p class="intro">Home is where you hang your hat.  Flank shank bacon, fatback boudin ham tongue beef ribs pig brisket pancetta frankfurter. Jerky pig biltong, chicken hamburger swine corned beef beef ribs beef jowl.</p>

          <div class="col-md-11 col-sm-12 col-xs-12 col-md-offset-1">

           <p><img src="http://img690.imageshack.us/img690/5169/36ng.png" class="col-md-3 img-responsive pull-left" alt="" />Bacon ipsum dolor sit amet short loin jerky salami sausage, hamburger t-bone doner filet mignon sirloin beef. Tail short ribs jerky leberkas prosciutto pastrami fatback jowl turkey t-bone bacon. Hamburger tail tri-tip, ribeye ham hock leberkas meatball pig short ribs jerky meatloaf. Flank shank bacon, fatback boudin ham tongue beef ribs pig brisket pancetta frankfurter. Jerky pig biltong, chicken hamburger swine corned beef beef ribs beef jowl. Kevin cow turducken, pancetta fatback swine pig boudin ball tip kielbasa venison. Pig salami capicola chuck pancetta pork.</p>

          </div>
        </div> <!--row-->
      </div> <!--col offset-->
    </div>