86 of 313 menu

Funktionen invert

Funktionen invert låter dig invertera färgerna i en bakgrundsbild. Värdet 0 betyder att bilden förblir oförändrad. Värdet 100% eller 1 inverterar bakgrundsfärgerna helt. Alla tal inom detta intervall inverterar färgerna delvis. Negativa värden kan inte anges. Standardvärdet är 0.

Syntax

selektor { filter: invert(tal); }

Exempel

Låt oss invertera färgerna i vår bild till värdet 50%:

<div id="elem"></div> #elem { filter: invert(50%); background: url("bg.png") center / cover no-repeat; width: 400px; height: 300px; border: 1px solid black; }

:

Exempel

Och låt oss nu invertera färgerna i vår bild till värdet 100%:

<div id="elem"></div> #elem { filter: invert(100%); background: url("bg.png") center / cover no-repeat; width: 400px; height: 300px; border: 1px solid black; }

:

Exempel

Och låt oss nu ange i funktionen invert ett värde lika med 0:

<div id="elem"></div> #elem { filter: invert(0); background: url("bg.png") center / cover no-repeat; width: 400px; height: 300px; border: 1px solid black; }

:

Se även

  • funktionen blur,
    som oskärper bakgrunden
  • funktionen brightness,
    som ställer in ljusstyrkan för bakgrunden
  • funktionen contrast,
    som ställer in kontrasten för bakgrunden
  • funktionen drop-shadow,
    som lägger till en skugga på bakgrunden
  • funktionen hue-rotate,
    som ställer in nyansförskjutning för bakgrunden
  • funktionen opacity,
    som ställer in opaciteten för bakgrunden
  • funktionen sepia,
    som omvandlar bakgrunden till sepia
  • egenskapen background,
    som är en genvägsegenskap för bakgrund
  • egenskapen background-image,
    som används för att sätta en bakgrundsbild på ett element
  • egenskapen filter,
    som applicerar filtereffekter på bakgrunden
Svenska
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
Vi använder kakor för webbplatsens funktion, analys och personalisering. Behandling av data sker i enlighet med Integritetspolicyn.
acceptera alla anpassa avvisa