CSS backdrop-filter ਵਿਸ਼ੇਸ਼ਤਾ

ਵਿਆਖਿਆ ਅਤੇ ਵਰਤੋਂ

backdrop-filter ਪ੍ਰਾਪਰਟੀ ਐਲੀਮੈਂਟ ਦੇ ਪਿੱਛੇ ਦੇ ਖੇਤਰ 'ਤੇ ਗਰਾਫਿਕਲ ਪ੍ਰਭਾਵ ਲਾਗੂ ਕਰਨ ਲਈ ਵਰਤੀ ਜਾਂਦੀ ਹੈ。

ਸੁਝਾਅ:ਇਸ ਪ੍ਰਭਾਵ ਨੂੰ ਦੇਖਣ ਲਈ ਐਲੀਮੈਂਟ ਜਾਂ ਇਸ ਦੇ ਪਿੱਨੇ ਨੂੰ ਘੱਟੋ-ਘੱਟ ਹਿੱਸਾ ਸਪਸ਼ਟ ਕਰਨਾ ਚਾਹੀਦਾ ਹੈ。

ਐਲੀਮੈਂਟ ਦੇ ਪਿੱਛੇ ਦੇ ਖੇਤਰ ਨੂੰ ਗਰਾਫਿਕਲ ਪ੍ਰਭਾਵ ਜੋੜੋ:

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

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

ਮੁੱਲ	ਵਰਣਨ
none	ਮੂਲ ਮੁੱਲ। ਪਿੱਨੇ ਤੇ ਕੋਈ ਫਿਲਟਰ ਨਾ ਲਾਗੂ ਕਰੋ。
filter	ਫਿਲਟਰ ਫੰਕਸ਼ਨਾਂ ਦੀ ਸੂਚੀ ਹੈ ਜੋ ਸਪੇਸ ਦੇ ਦੁਆਰਾ ਵੰਡੀ ਹੈ ਜਿਵੇਂ ਕਿ: blur() brightness() contrast() drop-shadow() grayscale() hue-rotate() invert() opacity() sepia() saturate() ਜਾਂ SVG ਫਿਲਟਰ ਦੀ URL ਦਿਸ਼ਾ ਵਿੱਚ ਪੁਸ਼ਟੀ ਕਰੋ。
initial	ਇਹ ਪ੍ਰਾਪਰਟੀ ਆਪਣੇ ਮੂਲ ਮੁੱਲ ਨੂੰ ਸੈੱਟ ਕਰੋ। ਦੇਖੋ: initial。
inherit	ਇਹ ਪ੍ਰਾਪਰਟੀ ਆਪਣੇ ਮਾਤਾ ਐਲੀਮੈਂਟ ਤੋਂ ਇਸ ਪ੍ਰਾਪਰਟੀ ਲੈ ਲੈਂਦਾ ਹੈ। ਦੇਖੋ: inherit。

ਮੂਲ ਮੁੱਲ:	none
ਵਿਰਾਸਤ:	ਨਹੀਂ
ਐਨੀਮੇਸ਼ਨ ਬਣਾਉਣ:	ਸਮਰਥਨ ਕਰੋ:ਐਨੀਮੇਸ਼ਨ ਸਬੰਧੀ ਪ੍ਰਾਪਰਟੀ。
ਸੰਸਕਰਣ:	CSS3
ਜਾਵਾਸਕ੍ਰਿਪਟ ਗਰੰਥ:	object.style.backdropFilter="grayscale(100%)"

ਸਾਰੇ ਸਮਾਂ ਤੋਂ ਅੱਗੇ ਦੇ ਸਮਾਂ ਵਿੱਚ ਇਹ ਪ੍ਰਾਪਰਟੀ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਕਰਨ ਵਾਲੇ ਬਰਾਉਜ਼ਰਾਂ ਦੀ ਸੰਖਿਆ ਹੈ。

ਪਹਿਲੀ ਬਰੀਕ ਇਹ ਪ੍ਰਾਪਰਟੀ ਸਮਰਥਨ ਕਰਨ ਵਾਲੀ -webkit- ਪ੍ਰਾਪਰਟੀ ਦੀ ਸੰਖਿਆ ਹੈ。

ਚਰਮ	ਐਜ਼	ਫਾਇਰਫਾਕਸ	ਸਫਾਰੀ	ਓਪਰਾ
76	79	103	9 -webkit-	63

ਸਿੱਖਿਆ ਪੁਸਤਕ:CSS تصویر