背景画像(background-image)

背景画像を指定する際の注意点

サイト全体の背景画像とタイトルや見出しのアイコンは、 サイトデザイン機能で設定できますので、サイト全体の背景は マニュアル「サイト背景の設定」機能 、タイトルや見出しのアイコンは マニュアル「見出しの設定」機能 を参照し変更して下さい。

背景画像の指定方法

背景画像を指定する際のCSSは「background-image:（背景画像を指定する値）」と記述します。関連して、背景画像の大きさを指定するbackground-sizeや反復の有無を指定するbackground-repeatと併せて使用することが多くあります。

記述例

ヘッダーに背景画像を指定する際のコードです。 画像の縦横のサイズで横幅は280px、高さは元の画像の縦横比を維持、画像の反復は一回だけ表示して繰り返さないよう指定しています。

.header.header-normal {
    background-image: url(https://manual.funmaker.work/wp-content/uploads/2021/06/bnr_1.png);
    background-size: 280px auto;
    background-repeat: no-repeat;
}

記述例のコードを設定した場合の表示は下記の通りです。 背景画像の解説は以上となります。

---

CSSでの設定はコードの記述をご自身の判断で行えるユーザー様向けの機能です。 ご留意ご利用にあたってはCSSマニュアルの使い方でご案内している注意事項をご理解の上で、ご自身の判断でお使いください。 コードに関して個別のご案内が必要な場合は、お見積りの上、当社で設定を代行することになりますので、ご入用でしたらお問い合わせフォームよりご連絡ください。