CSS sqrt() 関数

定義と使用方法

CSSの sqrt() 関数は数の平方根を返します。

例

内で calc() 関数で使用 sqrt() 三つの <div> 要素の幅と高さを設定するために：

div.a {
  width: calc(50px * sqrt(16)); /* 200px */
  height: calc(50px * sqrt(9)); /* 150px */
  background-color: salmon;
  margin-bottom: 25px;
}
div.b {
  width: calc(20px * sqrt(16)); /* 80px */
  height: calc(20px * sqrt(9)); /* 60px */
  background-color: green;
  margin-bottom: 25px;
}
div.c {
  width: calc(60px * sqrt(16)); /* 240px */
  height: calc(60px * sqrt(9)); /* 180px */
  background-color: maroon;
}

実際に試してみる

CSS 语法

sqrt(x)

技術的詳細

ブラウザのサポート

テーブルの数字は、その関数を完全にサポートする最初のブラウザのバージョンを示しています。

関連ページ

参考：CSS acos() 関数

参考：CSS asin() 関数

参考：CSS atan() 関数

参考：CSS atan2() 関数

参考：CSS calc() 関数

参考：CSS cos() 関数

参考：CSS exp() 関数

参考：CSS hypot() 関数

参考：CSS log() 関数

参考：CSS mod() 函数

参考：CSS sin() 函数

参考：CSS tan() 函数