De background-size
eigenschap in CSS is een van de nuttigste - en meest complexe - eigenschappen op de achtergrond. Er zijn veel variaties en verschillende syntaxis die u voor deze eigenschap kunt gebruiken, die allemaal verschillende gebruiksscenario's hebben. Hier is een eenvoudig voorbeeld:
html ( background: url(greatimage.jpg.webp); background-size: 300px 100px; )
Dat is een voorbeeld van de syntaxis met twee waarden voor de achtergrondgrootte. Er zijn vier verschillende syntaxis die u kunt gebruiken met deze eigenschap: de syntaxis van het trefwoord, de syntaxis van één waarde, de syntaxis van twee waarden en de syntaxis voor meerdere achtergronden.
Sleutelwoorden
Naast de standaardwaarde ( auto
) zijn er twee trefwoorden die u kunt gebruiken met background-size
: cover
encontain
Zie de achtergrondgrootte van de pen door CSS-Tricks (@ css-tricks) op CodePen.
Verwant
- achtergrond-bijlage
- achtergrond-clip
- Achtergrond kleur
- achtergrond afbeelding
- achtergrond-oorsprong
- achtergrond-positie
- achtergrond herhaling
Meer middelen
- CSS3 Spec
- MDN
Browser-ondersteuning
Chrome | Safari | Firefox | Opera | D.W.Z | Android | iOS |
---|---|---|---|---|---|---|
3+ | 4.1+ | 3.6+ | 10+ | 9+ | 2.3+ | 4.0+ |