From da78a9e329e272dedb2400b79a3bdeebff387d47 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:17 -0500 Subject: initial commit --- files/ko/web/css/angle/index.html | 115 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 115 insertions(+) create mode 100644 files/ko/web/css/angle/index.html (limited to 'files/ko/web/css/angle') diff --git a/files/ko/web/css/angle/index.html b/files/ko/web/css/angle/index.html new file mode 100644 index 0000000000..8125920a36 --- /dev/null +++ b/files/ko/web/css/angle/index.html @@ -0,0 +1,115 @@ +--- +title: +slug: Web/CSS/angle +tags: + - CSS + - CSS Data Type + - Data Type + - Layout + - Reference + - Web + - 자료형 +translation_of: Web/CSS/angle +--- +
{{CSSRef}}
+ +

CSS <angle> 자료형은 각도의 값을 도, 그레이드, 라디안 또는 회전수로 표현합니다. {{cssxref("<gradient>")}}나 일부 {{cssxref("transform")}} 함수에서 사용합니다..

+ +
{{EmbedInteractiveExample("pages/css/type-angle.html")}}
+ + + +

구문

+ +

<angle> 자료형은 {{cssxref("<number>")}} 다음에 아래 나열한 단위 중 하나를 붙여 구성합니다. 다른 CSS 단위처럼 숫자와 단위 문자 사이에 공백은 존재하지 않습니다. 숫자 0 뒤에는 단위를 붙이지 않아도 됩니다.

+ +

선택적으로 +, - 부호를 표시할 수 있습니다. 양의 부호는 시계방향 회전을, 음의 부호는 시계 반대방향 회전을 나타냅니다. 정적 속성에선 하나의 각도를 다른 각도로 표현할 수 있습니다. 예컨대 90deg는 -270deg, 1turn은 4turn과 동일합니다. 그러나 동적 속성, 즉 {{cssxref("animation")}}이나 {{cssxref("transition")}}에서는 결과가 달라집니다.

+ +

단위

+ +
+
deg
+
각도를 도 단위로 나타냅니다. 1회전은 360deg입니다. 예: 0deg, 90deg, 14.23deg
+
grad
+
각도를 그레이드로 나타냅니다. 1회전은 400grad입니다. 예: 0grad, 100grad, 38.8grad
+
rad
+
각도를 라디안으로 나타냅니다. 1회전은 2π 라디안으로 약 6.2832rad입니다. 1rad는 180/πdeg입니다. 예: 0rad, 1.0708rad, 6.2832rad
+
turn
+
각도를 회전의 수로 나타냅니다. 1회전은 1turn입니다. 예: 0turn, 0.25turn, 1.2turn
+
+ +

예제

+ +

시계 방향 우측 90도

+ + + + + + + + +
Angle90.png90deg = 100grad = 0.25turn ≈ 1.5708rad
+ +

반대로 회전

+ + + + + + + + +
Angle180.png180deg = 200grad = 0.5turn ≈ 3.1416rad
+ +

시계 반대 방향 우측 90도

+ + + + + + + + +
AngleMinus90.png-90deg = -100grad = -0.25turn ≈ -1.5708rad
+ +

회전 없음

+ + + + + + + + +
Angle0.png0 = 0deg = 0grad = 0turn = 0rad
+ +

명세

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{ SpecName('CSS4 Values', '#angles', '<angle>') }}{{ Spec2('CSS4 Values') }}
{{ SpecName('CSS3 Values', '#angles', '<angle>') }}{{ Spec2('CSS3 Values') }}Initial definition.
+ +

브라우저 호환성

+ + + +

{{Compat("css.types.angle")}}

-- cgit v1.2.3-54-g00ecf