CSS contrast() ਫੰਕਸ਼ਨ

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

CSS ਦੇ contrast() ਫਿਲਟਰ ਫੰਕਸ਼ਨ ਐਲੀਮੈਂਟ ਦੀ ਕੰਟਰਾਸਟ ਸੰਤੁਲਨ ਕਰਨ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ。

• 0% ਵਿੱਚ ਚਿੱਤਰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਗ੍ਰੇ ਹੋ ਜਾਵੇਗਾ
• 100%（ਜਾਂ 1）ਮੂਲ ਮੁੱਲ ਹੈ ਅਤੇ ਮੂਲ ਚਿੱਤਰ ਨੂੰ ਦਰਸਾਉਂਦਾ ਹੈ
• 100% ਤੋਂ ਵੱਧ ਦੇ ਮੁੱਲ ਕੰਟਰਾਸਟ ਵਧਾਉਂਦੇ ਹਨ
• 100% ਤੋਂ ਘੱਟ ਦੇ ਮੁੱਲ ਕੰਟਰਾਸਟ ਘਟਾਉਂਦੇ ਹਨ

ਇਨਸਟੈਂਸ

ਉਦਾਹਰਣ 1

ਚਿੱਤਰ ਦੀ ਕੰਟਰਾਸਟ ਵਧਾਉਣ ਅਤੇ ਘਟਾਉਣ:

#img1 {
  filter: contrast(150%);
}
#img2 {
  filter: contrast(50%);
}

ਆਪਣੇ ਅਨੁਭਵ ਕਰੋ

ਉਦਾਹਰਣ 2

ਵਰਤੋਂ contrast() ਨਾਲ backdrop-filter ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ ਨੂੰ ਮਿਲਾ ਕੇ ਵਰਤੋਂ:

div.transbox {
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: contrast(150%);
  backdrop-filter: contrast(150%);
  padding: 20px;
  margin: 30px;
  font-weight: bold;
}

ਆਪਣੇ ਅਨੁਭਵ ਕਰੋ

CSS ਸਿੰਥੈਕਸ

contrast(amount)

ਤਕਨੀਕੀ ਵੇਰਵੇ

ਬਰਾਊਜ਼ਰ ਸਮਰਥਨ

ਸਾਰੇ ਟੇਬਲ ਵਿੱਚ ਸੰਖਿਆਵਾਂ ਪਹਿਲੀ ਵਾਰ ਇਸ ਫੰਕਸ਼ਨ ਨੂੰ ਸਮਰਥਨ ਕਰਨ ਵਾਲੇ ਬਰਾਊਜ਼ਰ ਦੀ ਸੰਸਕਰਣ ਨੂੰ ਦਰਸਾਉਂਦੀਆਂ ਹਨ。

ਸਬੰਧਤ ਪੰਨੇ

参考：CSS فیلتر کی اپریٹی

参考：CSS blur() ਫੰਕਸ਼ਨ

参考：CSS brightness() ਫੰਕਸ਼ਨ

参考：CSS drop-shadow() ਫੰਕਸ਼ਨ

参考：CSS grayscale() ਫੰਕਸ਼ਨ

参考：CSS hue-rotate() ਫੰਕਸ਼ਨ

参考：CSS invert() ਫੰਕਸ਼ਨ

参考：CSS opacity() ਫੰਕਸ਼ਨ

参考：CSS saturate() 函数

参考：CSS sepia() 函数