CSS 函数 asin() 是一个三角运算,用于计算 -1 和 1 范围内值的反正弦。
此函数执行单个计算,并返回表示 -90° 和 90° 之间的 <angle> 值的弧度数。
可能的值
函数 asin(number)只允许将单个值作为参数。
- number - 导致数字在 -1 到 1 范围内的计算。
返回值
数的反正弦总是产生 <angle> 在 -90 度到 90 度的范围内。
- 如果该数字小于 -1 或大于 1,则结果为 NaN。
- 如果 number 为 0⁻,则结果为 0⁻。
语法
asin( <calc-sum> )
CSS asin() - 旋转元素
以下示例演示了函数 asin() 的用法。
<html>
<head>
<style>
div.box {
width: 100px;
height: 100px;
background-color: gray;
text-align:center;
font-size:30px;
}
div.boxA {
transform: rotate(asin(1));
margin-bottom: 20px;
margin-left:20px;
}
div.boxB {
transform: rotate(asin(0.5));
margin-bottom: 20px;
margin-left:20px;
}
div.boxC {
transform: rotate(asin(0));
margin-bottom: 20px;
margin-left:20px;
}
div.boxD {
transform: rotate(asin(-0.5));
margin-bottom: 20px;
margin-left:20px;
}
div.boxE {
transform: rotate(asin(-1));
margin-bottom: 20px;
margin-left:20px;
}
</style>
</head>
<body>
<div class="box boxA">A</div>
<div class="box boxB">B</div>
<div class="box boxC">C</div>
<div class="box boxD">D</div>
<div class="box boxE">E</div>
</body>
</html>