자바스크립트를 실행할 필요없이 스타일 시트에서 직접 사용자 지정 속성 등록을 나타낸다. 유효한 @property 규칙은 자바스크립트의 registerProperty()가 동등한 매개변수로 호출된 것처럼 사용자 정의 속성을 등록한다.
@property 규칙은 syntax와 inherits 설명자가 반드시 정의되어야 한다. initial-value 설명자는 syntax가 범용인 경우에 한해서 선택사항이다. 생락하면 초기값은 보장된 유효하지 않은 값이 된다.
@property <custom-property-name> { <declaration-list>
}아래 유형에서 지원하는 모든 키워드와 단위를 사용하지 않을 수도 있다.
사용자 정의 속성명을 나타낸다.
<dashed-ident>
두 개의 대시 문자로 시작하는 <custom-ident> 값이다.
<custom-ident> 의 하위 타입이며 암시하는 모든 대소문자 구분과 두 개의 대시(U+002D HYPHEN-MINUS)로 시작해야 한다는 추가 제한이 있다.
선언 목록을 나타낸다. 문법에서 블록의 유일한 값으로만 사용할 수 있으며 선언 목록 처리 알고리즘을 사용하여 블록의 내용을 구문 분석해야 함을 나타낸다.
[사용 가능한 값]은 설정 가능한 모든 값을 나열하지 않을 수도 있다. 자세한 사항은 각 항목의 추가 정보를 확인하라.
@property 규칙으로 표시되는 사용자 지정 속성 등록의 상속 플래그를 지정하여 속성이 기본적으로 상속되는지 여부를 제어한다. @property 규칙이 유효하려면 inherits 디스크립터가 작성되어야 한다.
true이면 선언후 재정의가 가능하며 false인 경우는 재정의가 불가하다.
선언후 재정의가 가능하다.
선언후 재정의가 불가하다.
@property 규칙으로 지정된 사용자 지정 속성 등록의 초기 값을 지정하여 속성의 초기 값을 제어한다. 선택사항이며 생략하면 속성의 초기 값은 보장된 무효값이다.
<declaration-value> 타입은 시퀀스에 허용되지 않는 토큰이 포함되지 않는 한 하나 이상의 토큰 시퀀스와 일치한다. 유효한 선언이 값으로 가질 수 있는 전체를 나타낸다.
<declaration-value>?@property 규칙으로 표현되는 사용자 지정 속성 등록의 구문을 지정하여 계산된 값 시점에 속성 값이 구문 분석되는 방식을 제어한다.
단위가 있는 값을 정의한다.
숫자 유형으로 선언한다.
퍼센트 유형으로 선언한다.
퍼센트를 포함한 단위가 있는 값으로 선언한다.
색상값으로 선언한다.
이미지 리소스 유형으로 선언한다.
url() 함수의 값을 사용한다.
정수 유형의 선언한다.
각도를 나타내는 유형으로 선언한다.
시간를 나타내는 유형으로 선언한다.
해상도를 나타내는 유형으로 선언한다.
변형 함수의 값을 나타내는 유형으로 선언한다.
임의의 사용자 정의 문자열로 선언한다.
유효한 변환 함수 값의 목록 유형으로 선언한다.
글꼴을 지정한다.
가상 요소로 생성할 콘텐츠를 설정한다.
인용 부호의 유형을 설정한다.
| Modules | ||
|---|---|---|
| Module Name | Status | Summary |
| CSS Properties and Values API Level 1 | 초안 작업 | Last review date: 2023-4-14 |