Fungsi hypot() CSS

Definisi dan penggunaan

CSS hypot() Fungsi mengembalikan akar kuadrat dari sumbu kuadrat parameter.

Nilai kembalian dihitung melalui formula sqrt(x1*x1 + x2*x2 + x3*x3 .... xn*xn).

hypot() Fungsi menerima nilai berunit, tetapi semua nilai harus memiliki unit yang sama.

Contoh

Gunakan hypot() Tetapkan lebar elemen:

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% */
}

Coba sendiri

Syarat CSS

hypot(x1, x2, x3, ...)
Nilai Penerangan
x1, x2, x3, ... Diperlukan. Satu atau lebih nilai yang dipisahkan dengan tanda koma.

Butir teknikal

Versi: CSS4

Dukungan pereka

Angka di dalam tabel menunjukkan versi pereka paling awal yang mendukung fungsi ini.

Chrome Edge Firefox Safari Opera
120 120 118 15.4 106

Laman berkenaan

Rujukan:Fungsi acos() CSS

Rujukan:Fungsi asin() CSS

Rujukan:Fungsi atan2() CSS

Rujukan:Fungsi calc() CSS

Rujukan:Fungsi cos() CSS

Rujukan:Fungsi exp() CSS

Rujukan:Fungsi hypot() CSS

Rujukan:Fungsi log() CSS

Rujukan:Fungsi mod() CSS

Rujukan:Fungsi pow() CSS

Rujukan:Fungsi sin() CSS

Rujukan:Fungsi sqrt() CSS

Rujukan:Fungsi tan() CSS