w3.css
공식 레퍼런스는 SCSS 문법을 기준으로 모든 문법을 설명하고 예시를 보여주므로 SCSS 문법으로 작성한 Sass를 사용하자.
숫자 함수
숫자 함수는 숫자 값을 조작하는 데 사용된다.
다음 표는 Sass의 모든 숫자 함수를 나열한다.
| 기능 | 설명 | 예시 |
|---|---|---|
| abs(숫자) | number의 절대값을 반환한다. | abs(15) 결과: 15 abs(-15) 결과: 15 |
| ceil(숫자) | 숫자를 가장 가까운 정수로 올림한다. | ceil(15.20) Result: 16 |
| comparable(숫자1, 숫자2) | 숫자1과 숫자2가 비슷한지 여부를 반환한다. | comparable(15px, 10px) 결과: true comparable(20mm, 1cm) 결과: true comparable(35px, 2em) 결과: false |
| floor(숫자) | 숫자를 가장 가까운 정수로 내림한다. | floor(15.80) 결과: 15 |
| max(숫자…) | 여러 숫자 중 가장 높은 값을 반환한다. | max(5, 7, 9, 0, -3, -7) 결과: 9 |
| min(숫자…) | 여러 숫자 중 가장 낮은 값을 반환한다. | min(5, 7, 9, 0, -3, -7) 결과: -7 |
| percentage(숫자) | 숫자를 백분율로 변환한다(숫자에 100을 곱한다). | percentage(1.2) 결과: 120 |
| random() | 0과 1 사이의 임의의 숫자를 반환한다. | random() 결과: 0.45673 |
| random(숫자) | 1과 숫자 사이의 임의의 정수를 반환한다. | random(6) 결과: 4 |
| round(숫자) | 숫자를 가장 가까운 정수로 반올림한다. | round(15.20) 결과: 15 round(15.80) 결과: 16 |
참고
W3C School - Sass Numeric Functions
Sass - Sass Basics
