CSS hypot() -funktio

Määrittely ja käyttö

CSS - hypot() Funktio palauttaa parametrien neliösumman neliön juuren.

Palautusarvo lasketaan kaavalla sqrt(x1*x1 + x2*x2 + x3*x3 .... xn*xn).

hypot() Funktio hyväksyy yksiköllisiä arvoja, mutta kaikkien arvojen yksiköt täytyy olla samat.

Esimerkki

Käytä hypot() Aseta elementin leveys:

div.a {
  width: hypot(80px); /* 80px */
}
div.b {
  width: hypot(40px, 80px); /* 89,44px */
}
div.c {
  width: hypot(40px, 80px, 100px); /* 134,16 */
}
div.d {
  width: hypot(40px, 80px, 100px, 120px); /* 180 */
}
div.e {
  width: hypot(10%, 20%, 40%); /* 45,82% */
}

Kokeile itse

CSS -syntaksi

hypot(x1, x2, x3, ...)
Arvo Kuvaus
x1, x2, x3, ... Välttämätön. Yksi tai useampi arvo, erotettuna pilkulla.

Tekninen yksityiskohta

Versio: CSS4

Selaimen tuki

Taulukossa olevat numerot ilmaisevat ensimmäisen selaimen version, joka täysin tukee tätä funktiota.

Chrome Edge Firefox Safari Opera
120 120 118 15,4 106

Liittyvät sivut

Viittaus:CSS acos() -funktio

Viittaus:CSS asin() -funktio

Viittaus:CSS atan2() -funktio

Viittaus:CSS calc() -funktio

Viittaus:CSS cos() -funktio

Viittaus:CSS exp() -funktio

Viittaus:CSS hypot() -funktio

Viittaus:CSS log() -funktio

Viittaus:CSS mod() -funktio

Viittaus:CSS pow() -funktio

Viittaus:CSS sin() funktio

Viittaus:CSS sqrt() funktio

Viittaus:CSS tan() funktio