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)

技术细节

浏览器支持

表格中的数字表示首个完全支持该函数的浏览器版本。