Fungu hue-rotate() cha CSS

Maelezo na matumizi

CSS inaonyesha hue-rotate() Fungu la kifungu kinachotumika kwa kumwambia rangi kwa kiwango cha kina.

Mfano

Mfano 1

Inasababisha uharibifu wa rangi wa picha zote:

#img1 {
  filter: hue-rotate(200deg);
}
#img2 {
  filter: hue-rotate(90deg);
}
#img3 {
  filter: hue-rotate(-90deg);
}

Jifunze tena

Mfano 2

inaonyesha hue-rotate() na backdrop-filter Inakusanya matumizi ya kifungu:

div.transbox {
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: hue-rotate(90deg);
  backdrop-filter: hue-rotate(90deg);
  padding: 20px;
  margin: 30px;
  font-weight: bold;
}

Jifunze tena

Inasema ya kiingiliano cha CSS

hue-rotate(angle)
Chaguo Maelezo
angle

Inahofanywa kwa chaguo. Inaonyesha ukosefu wa anga, inaonyesha uharibifu wa rangi wa samata.

Chaguo cha juu kinasababisha uharibifu wa rangi, chaguo cha chini kinasababisha uharibifu wa rangi.

0deg inaonyesha picha asilia (bila mafungo).

Chaguo cha kawaida ni 0.

Maelezo ya kidhunia

Toleo: CSS Filter Effects Module Level 1

Muhimu wa matumizi ya kifungu

Mafanikio ya tovuti inaonyesha toleo la kwanza ambao anahusiana na fungu hii.

Chrome Edge Firefox Safari Opera
18 12 35 6 15

Makoa ya muhimu

Tazama:Mwongozo wa CSS filter

Tazama:Fungu la blur() kwenye CSS

Tazama:Fungu la brightness() kwenye CSS

Tazama:Fungu la contrast() kwenye CSS

Tazama:Fungu la drop-shadow() kwenye CSS

Tazama:Fungu la grayscale() kwenye CSS

Tazama:Fungu la invert() kwenye CSS

Tazama:Funksheni ya CSS opacity()

Tazama:Funksheni ya CSS saturate()

Tazama:Funksheni ya CSS sepia()