ブートストラップで背景画像を設定する方法

#ブートストラップで背景画像を設定して自動的に適応させる方法

ブラウザ: chrome

CSS を使用します: ブートストラップ (これは CSS 設定に影響する可能性があるため、まだ言及します)

背景画像を設定する過程で、背景画像が希望どおりに画面に自動的に適応できないことがよくあります。私も同様で、さまざまな方法を試した結果、自分の状況に適した設定を見つけました。

コードは次のとおりです:

body {
  background-image: url("../images/backgroundImg2.jpg");
  background-position: center 0;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
}

このようにして、本体の背景画像が画面に自動的に適応するように正常に設定できます。

ただし、他のブラウザでの対応は未確認ですが、現在はChromeで利用可能です。

関連プロパティ:

background-image プロパティは、要素の背景画像を設定します。

要素の背景は、パディングと境界線を含む要素のサイズ全体を占めますが、マージンは含みません。

デフォルトでは、背景画像は要素の左上隅に配置され、水平方向と垂直方向に繰り返されます。

ヒント: 背景画像が利用できない場合でも、ページに良好な視覚効果が得られるように、利用可能な背景色を設定してください。

関連する推奨事項:「

ブートストラップ チュートリアル」

以上がブートストラップで背景画像を設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。