CSS <calc-keyword> Data Type
The CSS <calc-keyword> data type represents mathematical constants and special numeric values that can be used in CSS math functions. These keywords provide predefined values for common mathematical constants, infinity, and values that do not represent a valid number.
Syntax
The <calc-keyword> data type accepts five keyword values:
<calc-keyword> = e | pi | infinity | -infinity | NaN<calc-keyword> Values
| Value | Description |
|---|---|
e |
Represents Euler's number, approximately 2.71828. |
pi |
Represents the mathematical constant pi, approximately 3.14159. |
infinity |
Represents positive infinity. |
-infinity |
Represents negative infinity. |
NaN |
Represents an undefined or unrepresentable numeric result, meaning Not a Number. |
Using <calc-keyword> Values
Calc keywords can be used as components of calculations in CSS math functions. The constants e and pi provide predefined mathematical values, while infinity, -infinity, and NaN represent special numeric values that may occur during calculations.
When a calc keyword is used in a calculation, it is treated as a <number>. A calculation can combine the keyword with compatible values and mathematical operators to produce the value required by a CSS property.
<calc-keyword> Example
The following example uses the pi keyword in a calculation. Multiplying pi by 1rad produces an angle of approximately 180 degrees:
.example {
transform: rotate(calc(pi * 1rad));
}Specifications
The <calc-keyword> data type is defined in the CSS Values and Units Module Level 4 .