CSS 函式 - asin()

CSS 函式asin()是一個三角運算，用於計算-1到1範圍內值的反正弦。

此函式執行單個計算，並返回表示<angle>值的弧度數，該值介於-90°和90°之間。

可能的值

asin(number)函式僅允許單個值作為引數。

number - 計算結果為number，該值在-1到1的範圍內。

返回值

number的反正弦始終導致<angle>在-90deg到90deg的範圍內。

如果number小於-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>

列印頁面