82 of 313 menu

Funktionen brightness

Funktionen brightness låter dig ändra ljusstyrkan på en bakgrundsbild. Den ursprungliga ljusstyrkan bestäms av värdet 100% eller 1, när dessa minskas så minskas även bildens ljusstyrka. Följaktligen, när värdet ökas över 100% ökar ljusstyrkan. Negativa värden tillämpas inte, och ett tomt värde tolkas automatiskt som 1.

Syntax

selektor { filter: brightness(tal); }

Exempel

Låt oss ställa in ljusstyrkan för vår bild till 20%:

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

:

Exempel

Och låt oss nu öka bildens ljusstyrka till 120%:

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

:

Exempel

Låt oss ställa in ursprunglig ljusstyrka för vår bild:

<div id="elem"></div> #elem { filter: brightness(1); 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 contrast,
    som ställer in kontrast på bakgrunden
  • funktionen drop-shadow,
    som lägger till en skugga på bakgrunden
  • funktionen hue-rotate,
    som ställer in nyans på bakgrunden
  • funktionen invert,
    som inverterar bakgrundens färger
  • funktionen opacity,
    som ställer in genomskinlighet på bakgrunden
  • funktionen sepia,
    som omvandlar bakgrunden till sepia
  • egenskapen background,
    som är en sammanfattande egenskap för bakgrund
  • egenskapen background-image,
    som används för att sätta en bakgrundsbild på ett element
  • egenskapen filter,
    som applicerar effekter 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