비디오: What the heck is the event loop anyway? | Philip Roberts | JSConf EU 2025
W3C (World Wide Web Consortium)에서 만든 CSS 사양은 구문 및 가능한 값을 모두 정의합니다. CSS 속성. 정의를 가능한 한 정확하게 만들기 위해 W3C는 CSS 값 정의 구문이라는 공식 시스템을 사용합니다.
정의 구문은 가능한 값을 매우 정확하게 정의하지만 CSS 값 정의가 쓰여지는 구문을 읽는 것은 키 없이는 어려울 수 있습니다. 그러나 실제로는 그러한 구문을 읽는 것이 아주 간단합니다. 예를 들어, 마진 바로 가기 속성의 값 구문은 다음과 같습니다.
[| | auto] {1, 4}
여백 속성의 유효한 사용법은 다음과 같습니다.
margin: 0px; 마진: 1px 10 %; 여백: 1px 자동 0px; 여백: 1px 0px 1px 0px;
마진 속성이나 각 예제가 무엇인지 모를지라도, 정의를보고 예제를 검토하는 것만으로 구문 정의를 읽는 방법을 파악할 수 있습니다.
CSS 값 정의 구문을 읽는 방법은 다음과 같습니다.
자동 키워드의 경우처럼 단어를 그대로 사용해야 함을 나타냅니다. 기본 CSS 데이터 유형이 사이에 나타납니다. 예를 들어, 및는 다른 곳에서 정의 된 기본 유형입니다. 이러한 유형 중 하나를 볼 때 해당 데이터 유형의 유효한 값을 사용할 수 있다는 것을 알고 있습니다.
두 개의 앰퍼샌드 (&&)가 함께 표시되면이 기호로 구분 된 값은 모두 필수 사항이지만 임의의 순서로 나타날 수 있음을 의미합니다.
->
대괄호 ([])는 값을 하나로 묶습니다.||로 구분 된 값 선택 사항입니다. 그러나 그 중 하나가 나타나야하며 어떤 순서로도 나타날 수 있습니다.
| 문자는 옵션이 배타적이라는 것을 의미합니다. 정확히 그 중 하나가 나타나야합니다.
별표 (*)는 값이 0, 1 회 또는 여러 번 나타날 수 있음을 나타냅니다.
더하기 기호 (+)는 값이 한 번 또는 여러 번 나타날 수 있음을 의미합니다.
물음표 (?)는 값이 선택 사항임을 나타냅니다. 표시되는 경우 한 번만 표시 될 수 있습니다.
보시다시피, 고정 길이 값 (예: 10px)이 허용됩니다.
보시다시피, 10 %와 같은 백분율 값이 허용됩니다.
숫자가 {1, 4}와 같이 대괄호 안에 표시되면 속성이 첫 번째 숫자로 지정된 횟수로 나타나야한다는 것을 나타냅니다. 그러나 두 번째 숫자에 표시된 횟수만큼 나타날 수 있습니다. {1, 4}의 경우 속성은 한 번 나타나야하지만 네 번 나타날 수 있습니다.
# 기호는 값이 한 번 또는 여러 번 반복 될 수 있음을 나타냅니다. 각 값은 쉼표로 구분해야합니다.
