中心對齊的響應圖像第2部分的左對齊標題

Question

@ partypete25和其他任何人都可以幫忙！

感謝：

左對齊標題用於中心對齊的響應圖像

和

https://jsfiddle.net/mk7on98L/19/

它也為我工作！ 但是，我似乎在圖像下面沒有多行文本。 我嘗試使用BR並添加更多行文本，但出現了錯誤。 關於多行文本，在每行文本的末尾帶有BR的任何建議？ 謝謝！

我正在嘗試使用這樣的東西：

<div class="container">
  <div class="row">
    <div class="col-xs-12">
      <span class="text-center center-block" style="max-width:100%">
        <span data-caption="line 1 of text <br> line 2 of text <br> line 3 of text" class="img-wrapper text-left">
          <img class="img-responsive" src="http://placehold.it/350x150">
        </span>
      </span>
    </div>
  </div>
</div>

問候，

Answer 1

我認為您在這兩個方面很難。 只需將標題與圖像分開即可。

<div class="container">
  <div class="row">
    <div class="col-xs-12">
      <span style="width:100%; margin:0 auto;">
          <img class="img-responsive" src="http://placehold.it/350x150">
      </span>
      <span class="caption">line 1 of text <br> line 2 of text <br> line 3  of text</span>
    </div>
  </div>
</div>

Answer 2

對於多行，您需要在.img-wrapper上指定寬度