ジャンボトロンコンポーネント（ブートストラップ）の右領域にイメージを追加する方法

Question

こんにちはブートストラップのjumbotronコンポーネントにイメージを挿入します。

ジャンボトロンの右側の領域に挿入します。 私はこのコードを持っている：

<section class="jumbotron text-center"> 
    <div class="container"> 
    <h1 class="jumbotron-heading">My site</h1> 
    <p class="lead text-muted">Welcome to our page</p><br> 
    <h2 class="jumbotron-heading"><b>Random form</b></h1><br> 
... 

をそして、これは私が得るものです： site

私はそれのためにCSSを使用する必要がありますか？

多分私の質問は愚かで、それはできませんが、私は今すぐブーストラップを学び始めましたので、私を理解してください。

すべての回答ありがとうございます。

Answer 1

これを達成するためにブートストラップグリッドを使用できます（3.3.7バージョンを使用していると仮定します）。必要に応じて
は、グリッド応答ブレークポイントを調整します。

さらに

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="jumbotron"> 
 
    <div class="container"> 
 
    <div class="row"> 
 
     <div class="col-xs-offset-2 col-xs-8"> 
 
     <h1>Hello, world!</h1> 
 
     <p>This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p> 
 
     <p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p> 
 
     </div> 
 
     <div class="col-xs-2"> 
 
     <img class="img-responsive" src="https://cdn.pixabay.com/photo/2017/10/01/18/47/trimaran-2806616_1280.jpg" alt=""> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

：あなたが.containerの外に画像を使用する必要があるならば、あなたはcol-xs-offset-2 col-xs-8のdivの内側の容器をラップする必要があります。ここでもまた、列と応答可能なブレークポイントを調整する必要があります。