HTMLのバックグラウンドイメージ属性の設定の詳細な説明

バックグラウンドイメージプロパティを使用すると、バックグラウンドに表示される画像を指定できます。背景色と組み合わせて使用​​できるため、画像が繰り返されない場合、画像をカバーできない場合は背景色が背景色で満たされます。コードはシンプルです。パスはスタイルシートに関連していることを忘れないでください。次のコードでは、画像とスタイルシートが同じディレクトリにあることを覚えておいてください。

写真については、最初に背景の写真を考えます。なぜなら、私たちの装飾の多くは背景の写真で達成されているからです。そのため、CSSコントロールの背景画像から始めましょう。

バックグラウンドイメージプロパティは、要素の背景画像を設定します。

要素の背景は、内側の縁や境界を含むが、外側の縁を含む要素のすべての寸法を取り上げます。

デフォルトでは、背景画像は要素の左上隅にあり、水平および垂直に繰り返されます。

Webページの場合、設計を開始したとき、背景画像が何であるかについてあまり考えないかもしれません。前景音楽と同じであり、Webページの開く速度が特定の影響を与えるため、非常に簡単だと思います。ただし、一般的な個人的なWebサイトや個人のブログの場合、もちろん自分の性格を示すことは不可欠です。もちろん、それほど完璧なものではありません。良いことと悪いことがあります。つまり、画像が利用できないがCSSが利用可能な場合、交換コンテンツは表示されません。したがって、ナビゲーションボタンテキストまたは同様の状況でCSSの背景画像を使用することはお勧めしません。

背景画像を制御する多くのCSS属性があり、それらのほとんどは、それらが画像に関連している限り使用されます。

もちろん、誰もが最もよく知っているのは、背景と背景イメージです。

Webページの背景画像を設計するためのコードは次のとおりです。

ボディ{背景：url（d：/images/04.jpg）}

または

body {background-image：url（d：/images/04.jpg）}

このようにして、背景としてWebページに使用する写真をインポートできます。

もちろん、上記のコードのみを使用しても、必要な効果を表現できません。写真が小さい場合、それは平らな方法でタイル張りになるからです。それが大きい場合、それを表示するために、スクロールバーが表示されますが、これは良くありません。したがって、ディスプレイコントロールにはバックグラウンドリピートを使用する必要があります。

それは価値です：

繰り返し：デフォルト値。肖像画と水平方向にタイル張りの背景画像

ノーリピート：背景画像はタイル張りではありません

Repeat-X：背景画像は水平にのみタイル張りです

繰り返します：背景画像は垂直方向のみでタイル張りです

コードに関しては、小さなCSSを知っている人なら誰でも次のように知っていると思います

：

body {background：url（d：/images/04.jpg）; background-repeat：no-repeat}

このようにして、元の画像サイズで表示されます。

しかし、問題は、写真が大きすぎる場合はどうなりますか？優れたWebページの場合、大きすぎる画像を使用しないことが最善です。その理由は上記でも言及されており、これはWebページを開く速度に影響します。 PSまたは花火を使用して処理する方が良いでしょう。しかし、私はそれについて言及して以来、私たちはCSSを使用して画像サイズを制御することを恐れていません。

多くの人が自然に次のコードを使用すると思います。