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)
值 描述
x 必需。大于或等于 0 的數。

技術細節

版本： CSS4

瀏覽器支持

表格中的數字表示首個完全支持該函數的瀏覽器版本。

Chrome Edge Firefox Safari Opera
120 120 118 15.4 106

相關頁面

參考：CSS acos() 函數

參考：CSS asin() 函數

參考：CSS atan() 函數

參考：CSS atan2() 函數

參考：CSS calc() 函數

參考：CSS cos() 函數

參考：CSS exp() 函數

參考：CSS hypot() 函數

參考：CSS log() 函數

參考：CSS mod() 函數

參考：CSS sin() 函數

參考：CSS tan() 函數