今回はサイトの華である、メインイメージを配置してみましょう。画面の横幅いっぱいに画像が表示され、キャッチコピー的なテキストが乗ってるアレですね。Bootstrapでは「jumbotron(ジャンボトロン)」というクラスで実現できます。 このように、横幅いっぱいの画像を表示するまでが今回の内容となります。 画像に重なったキャッチコピー、ボタンの配置に関しては、次回解説予定です。 「jumbotron」クラスを使ってみよう! それでは早速、実践していきましょう。 前回作成したindex.htmlファイルを引き続き使用します。念の為、index.htmlと同じ階層に画像が準備されているか、確認してくださいね。画像は前回の記事からダウンロードできます。 HTMLソースをコピペする index.htmlを開き、前回貼り付けたLOGO画像部分の下(※)に以下のHTMLをコピペしてください。 ※「<!–
![Bootstrapで横幅いっぱいに画像を表示しよう!ジャンボトロン(jumbotron)の設置方法 | 隣IT](https://cdn-ak-scissors.b.st-hatena.com/image/square/5cf79688df68da9b3a2567b37648ddbd01da54fe/height=288;version=1;width=512/https%3A%2F%2Ftonari-it.com%2Fwp-content%2Fuploads%2F689c32b49dd00ad5dc97321ec964626a.jpg)