メインビジュアルの設定

ページの主役 メインビジュアル

検索エンジンなどを経由してWebサイトを訪れた際に、最初に目に飛び込んでくるのはメインビジュアルやロゴマークなどの大きな画像です。Webサイトの第一印象を決める大切なポイントです。

スタイリング自体は簡単です

ではメインビジュアル部分をスタイリングしていきましょう。今回はimg要素を使って画像を表示するため、HTMLを書き換えます。

HTML
<div id="mainvisual">
    <img src="./img/main.jpg" alt="メインビジュアル" width="800" height="250" />
</div>

以上でメインビジュアル部分が完成しました。

メインビジュアルを追加したサンプル文書


→次のページ:装飾する(main部分 サービス)

←前のページ:装飾する(header メニュー部分)