సిఎస్ఎస్ బ్యాక్డ్రోప్-ఫిల్టర్ అట్రిబ్యూట్

నిర్వచనం మరియు వినియోగం

backdrop-filter ఈ గుణం ఎలిమెంట్ బాక్గ్రౌండ్ పై గ్రాఫికల్ ప్రభావాలు వర్తించేది.

సూచన:ప్రభావాన్ని చూడడానికి, ఎలిమెంట్ లేదా దాని బ్యాక్గ్రౌండ్ కనీసం పాక్షికంగా పారంతర్యం చేసుకుంటుంది.

ఉదాహరణ

ఎలిమెంట్ బాక్గ్రౌండ్ పై గ్రాఫికల్ ప్రభావాలు జోడించండి:

div.transbox {
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}

ప్రయత్నించండి:

CSS వినియోగం

backdrop-filter: none|filter|initial|inherit;

గుణం విలువ

విలువ వివరణ
none మూల విలువ. బ్యాక్గ్రౌండ్ పై ఫిల్టర్ వర్తించలేదు.
filter

అనుక్రమంలో ఫిల్టర్ ఫంక్షన్స్ జాబితా, ఉదాహరణకు:

  • blur()
  • brightness()
  • contrast()
  • drop-shadow()
  • grayscale()
  • hue-rotate()
  • invert()
  • opacity()
  • sepia()
  • saturate()

లేదా SVG ఫిల్టర్ యూఆర్ఎల్ సూచించండి.

initial ఈ గుణం ని దాని మూల విలువకు అనుమతిస్తుంది. చూడండి: initial.
inherit ఈ గుణం ని తన పైవర్గ ఎలిమెంట్ నుండి పారంతర్యం చేసుకుంటుంది. చూడండి: inherit.

సాంకేతిక వివరాలు

మూల విలువ: none
పారంతర్యం గుణం: లేదు
అనిమేషన్ తయారీ: సహాయం చేయండి:అనిమేషన్ సంబంధిత గుణం.
వెర్షన్: CSS3
JavaScript వినియోగం: object.style.backdropFilter="grayscale(100%)"

బ్రౌజర్ సహాయం

పట్టికలో ఉన్న సంఖ్యలు ఈ గుణంపై పూర్తిగా సహాయకంగా అనుమతించిన బ్రౌజర్ వెర్షన్ నంబర్ సూచిస్తాయి.

ఈ ప్రత్యేకతలు సహాయక ప్రత్యేకతలు అనేది ఈ ప్రత్యేకతలను మొదటిసారి సహాయకంగా అనుమతించిన వెర్షన్ నంబర్ సూచించేది.

క్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఓపెరా
76 79 103 9 -webkit- 63

సంబంధిత పేజీలు:

పాఠ్యం:CSS చిత్రాలు

సూచనలు:CSS ఫిల్టర్ అంశం

సూచనలు:HTML DOM filter గుణం