CSS round() 함수

정의와 사용법

CSS의 round() 함수는 지정된 둘러서기 전략에 따라 숫자를 가장 가까운 둘러서기 간격의 정수 배로 둘러서기

사용 round() 지정된 둘러서기 전략에 따라 숫자를 가장 가까운 둘러서기 간격의 정수 배로 둘러서기

div.box2 {
  height: round(up, 105px, 25px);
}
div.box3 {
  height: round(down, 120px, 25px;
}
div.box4 {
  height: round(to-zero, 115px, 25px);
}

round(rounding-strategy, valuetoround, roundinginterval)

값	설명
rounding-strategy	선택 사항. 둘러서기 전략을 지정합니다. 다음 중 하나의 값 중 하나일 수 있습니다: nearest: 기본 값. valuetoround 값을 가장 가까운 roundinginterval의 정수 배로 둘러싸기 up: valuetoround 값을 가장 가까운 roundinginterval의 정수 배로 올림으로 둘러싸기 down: valuetoround 값을 가장 가까운 roundinginterval의 정수 배로 내림으로 둘러싸기 to-zero: valuetoround 값을 가장 가까운 roundinginterval의 정수 배로 둘러서고 가장 가까운 0에 가까운 정수 배로 둘러싸기
valuetoround	必需。끝나는 값(숫자, 백분율, 크기 또는 수학 표현식)
roundinginterval	必需。끝나는 간격(숫자, 백분율, 크기 또는 수학 표현식)

값

설명

rounding-strategy

선택 사항. 둘러서기 전략을 지정합니다. 다음 중 하나의 값 중 하나일 수 있습니다:

nearest: 기본 값. valuetoround 값을 가장 가까운 roundinginterval의 정수 배로 둘러싸기
up: valuetoround 값을 가장 가까운 roundinginterval의 정수 배로 올림으로 둘러싸기
down: valuetoround 값을 가장 가까운 roundinginterval의 정수 배로 내림으로 둘러싸기
to-zero: valuetoround 값을 가장 가까운 roundinginterval의 정수 배로 둘러서고 가장 가까운 0에 가까운 정수 배로 둘러싸기

valuetoround

必需。끝나는 값(숫자, 백분율, 크기 또는 수학 표현식)

roundinginterval

必需。끝나는 간격(숫자, 백분율, 크기 또는 수학 표현식)

버전：	CSS4

표에서의 숫자는 이 함수를 최초로 완전히 지원한 브라우저 버전을 나타냅니다.

크롬	에지	파이어폭스	사파리	오페라
125	125	118	15.4	111