Fungsi hypot() CSS

Definisi dan penggunaan

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

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() Atur 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

Sintaks CSS

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

Detil teknis

Versi： CSS4

Dukungan browser

Angka di tabel menunjukkan versi browser yang mendukung fungsi ini penuh.

Chrome Edge Firefox Safari Opera
120 120 118 15.4 106

Halaman yang berhubungan

Referensi:Fungsi acos() CSS

Referensi:Fungsi asin() CSS

Referensi:Fungsi atan2() CSS

Referensi:Fungsi calc() CSS

Referensi:Fungsi cos() CSS

Referensi:Fungsi exp() CSS

Referensi:Fungsi hypot() CSS

Referensi:Fungsi log() CSS

Referensi:Fungsi mod() CSS

Referensi:Fungsi pow() CSS

Referensi:Fungsi sin() CSS

Referensi:Fungsi sqrt() CSS

Referensi:Fungsi tan() CSS