写真の場合、私たちが最初に考えるのは背景画像です。なぜなら、装飾の多くは背景画像を使用して実装されているからです。今回はCSSで背景画像を制御することから始めましょう。
定義と使用法
background-image 属性は、要素の背景画像を設定します。
要素の背景は、パディングと境界線を含む要素のサイズ全体を占めますが、マージンは含みません。
デフォルトでは、背景画像は要素の左上隅に配置され、水平方向と垂直方向に繰り返されます。
1. CSS コントロールの背景画像:
Web ページのデザインを始めるとき、背景画像が何であるかについてはあまり考えないかもしれません。ほとんどの場合、背景色をデザインするだけなので、理由は非常に単純だと思います。音楽と同じように、Web ページを開く速度に一定の影響を与えます。しかし、一般的な個人のウェブサイトや個人のブログでは、もちろん、完璧すぎるものはありません。つまり、CSS が有効になっている場合です。 、置換コンテンツは表示されないため、ナビゲーション ボタンのテキストや同様の状況に CSS 背景画像を使用することはお勧めできません。
背景画像を制御するための CSS プロパティは多数あり、画像に関連するものであれば、そのほとんどが使用されます。
(1) 背景画像のインポート:
もちろん、最もよく知られているのは、背景と背景画像です。
Web ページの背景画像をデザインするコードは次のとおりです:
body {background:url("d:images
またはbody {背景画像:url("d:images
(2) 背景画像の表示方法：
もちろん、上記のコードだけでは思い通りの効果を表現することはできません。画像が小さいと並べて表示されてしまうので、大きいと表示するためにスクロールバーが表示されてしまい、良くありません。したがって、さらに表示制御を実行する必要があります。つまり、background-repeat、を使用する必要があります。
それは値です:
no-repeat: 背景画像は並べて表示されません
repeat-x: 背景画像は水平方向にのみ並べて表示されますrepeat-y: 背景画像は垂直方向にのみ並べて表示されます
コードについては、CSS を少し知っている人ならわかると思いますが、次のようになります。
:
(3)、背景画像サイズ制御:
多くの人は次のコードを自然に使用すると思います:
コードをコピー
