1. ホーム
  2. css

[解決済み] CSSで背景画像を中央に配置する

2022-04-21 08:30:47

質問

背景画像を中央に配置したい。divは使われておらず、これは CSS のスタイルになります。

body{
    background-position:center;
    background-image:url(../images/images2.jpg) no-repeat;
}

上記のCSSは全体にタイルを貼り、中央揃えにしていますが、画像の半分は見えず、ただなんとなく上に移動しています。画像の中央に表示させたいのですが、どうすればよいでしょうか?21"の画面でも見えるように採用できないでしょうか?

解決方法を教えてください。

background-image: url(path-to-file/img.jpg);
background-repeat:no-repeat;
background-position: center center;

これでうまくいくはずです。

そうでない場合は div を画像と一緒に使用し z-index を使えば、それを背景にすることができますか?これなら、ボディに背景画像を配置するよりも、ずっと簡単にセンタリングできますね。

それ以外のトライ。

background-position: 0 100px;/*use a pixel value that will center it*/ または、ボディを設定した場合は50%でもいいと思います。 min-height を100%に設定します。

body{

    background-repeat:no-repeat;
    background-position: center center;
    background-image:url(../images/images2.jpg);
    color:#FFF;
    font-family:Arial, Helvetica, sans-serif;
    min-height:100%;
}