background-image

Podsumowanie

Własność background-image ustawia obrazek tła dla elementu.

Składnia

background-image: uri | none | inherit

Wartości

uri 

Położenie zasobu obrazka używanego jako obrazek tła.

none 

Używane do wyszczególnienia, że dany element nie powinien mieć obrazka tła.

Przykłady

Note that the star image is partially transparent and is layered over the cat image.

HTML

<div>
    <p class="catsandstars">
        This paragraph is full of cats<br />and stars.
    </p>
    <p>This paragraph is not.</p>
    <p class="catsandstars">
        Here are more cats for you.<br />Look at them!
    </p>
    <p>And no more.</p>
</div>

CSS

pre, p {
    font-size: 1.5em;
    color: #FE7F88;
    background-color: transparent;
}

div {
  background-image: url("https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png");
}

p {
  background-image: none;
}

.catsandstars {
  background-image:  url("https://mdn.mozillademos.org/files/11991/startransparent.gif"), 
                     url("https://mdn.mozillademos.org/files/7693/catfront.png");
  background-color: transparent;
}

Result

Uwagi

Twórcy powinni się upewnić, że określili background-color do użycia w przypadku, jeśli obrazek jest niedostępny. Obrazki tła są wyświetlane nad kolorem tła.

Specyfikacje

• CSS 1
• CSS 2.1
• CSS 3

Zgodność z przeglądarką