web-dev-qa-db-ja.com

背景画像が表示されない

タグを使用してサイトに表示される画像を背景画像に変換しようとしています。私の最初のコードはこのように見えました

HTML:

<img class= "house" src="images/House-03.png" width="122px" height="118px"/>

CSS

.house {
display:block;
position:absolute;
float:right;
bottom:0;
right:0;

}

今、私はこれを次のように変更しようとしています:

HTML

<p class= "house"> </p>

CSS

.house {
    display:block;
    position:absolute;
    background-image:url(../images/House-03.png);
    width:122px;
    height:148px;
    float:right;
    bottom:0;
    right:0;
}

画像が表示されないことを除いて!どんな助けでも感謝します、ありがとう!

12
kduan

背景画像サイズのプロパティを設定してみてください

.house {
    display:block;
    position:absolute;
    background:url(../images/House-03.png);
    background-repeat:no-repeat;
    background-size: 100% 100%;
    width:122px;
    height:148px;
    float:right;
    bottom:0;
    right:0;
}

お役に立てれば?

23
rand0m

画像のURLを引用符で囲みます

background-image:url("../images/House-03.png");

ETA:以下のコメントごとに...引用符は実際には必要ありません!元の質問のトラブルシューティングを行うためにここで言及しただけです。

2
user3037493

個人的には、パス名とURLの構文は正しいものです。唯一の問題は

background-img: url("") 

に変更する必要があります。

background: url("")

そして、私の背景パターンは意気揚々と現れました。

2
haej

画像にアクセスできることを確認してください!

多くのフラストレーションの後、私の問題はアクセスできない画像に関係していることが判明しました...確実にアクセスできる別のサイトの別の画像でコードをいつでもテストできます...

1
Damian Green