CSS 스냅샷 2026

1. 소개

첫 번째 CSS 명세가 발행되었을 때, CSS 전체는 CSS 레벨 1을 정의하는 하나의 문서에 담겨 있었습니다. CSS 레벨 2도 단일한 다중 장(章) 문서로 정의되었습니다. 그러나 레벨 2를 넘어서는 CSS의 경우, CSS 작업 그룹은 단일 거대 명세를 정의하는 대신 각 모듈이 CSS의 일부를 정의하는 모듈식 접근을 채택하기로 했습니다. 이는 명세를 더 관리하기 쉬운 여러 부분으로 나누고 CSS를 보다 즉각적이고 점진적으로 개선할 수 있게 합니다.

서로 다른 CSS 모듈들이 서로 다른 안정성 수준에 있기 때문에, CSS 작업 그룹은 2026년 기준의 계단식 스타일 시트의 현재 범위와 상태를 정의하기 위해 이 프로필을 발행하기로 했습니다.

1.1. CSS란 무엇인가?

Cascading Style Sheets (CSS)

CSS는 스타일 시트를 작성하기 위한 언어이며, 구조화된 문서 (예를 들면 HTML 및 XML)의 렌더링을 다양한 매체에서 기술하도록 설계되었습니다. CSS는 소스 문서의 표현을 기술하는 데 사용되며, 보통 그 문서의 문서 언어가 표현하는 기저 의미를 변경하지 않습니다.

Style sheet

문서의 표현을 지정하는 규칙들의 집합입니다. 스타일 시트는 Author가 작성하고, user agent가 이를 해석하여 문서를 User에게 제시합니다.

Source document

하나 이상의 스타일 시트가 적용되는 문서입니다. 소스 문서의 구조와 의미는 문서 언어(예: HTML, XHTML, 또는 SVG)를 사용하여 인코딩됩니다.

Author

Author는 문서와 그에 연관된 스타일 시트를 작성하는 사람입니다. authoring tool은 스타일 시트를 생성하는 user agent입니다.

User

User는 user agent와 상호작용하여 문서를 보거나 듣거나 그 밖의 방식으로 사용하는 사람입니다.

User agent (UA)

User agent는 문서와 그에 연관된 style sheets를 user를 대신하여 해석하는 모든 프로그램입니다. user agent는 문서를 표시하거나, 소리 내어 읽거나, 인쇄되게 하거나, 다른 형식으로 변환하는 등의 일을 할 수 있습니다. CSS 명세의 목적상, user agent는 이들 명세에서 정의한 대로 Cascading Style Sheets를 지원하고 해석하는 프로그램을 의미합니다.

1.2. 배경: W3C 프로세스와 CSS

이 절은 비규범적입니다.

W3C Process에서 권고안 트랙 문서는 아래에 요약된 세 가지 안정성 단계를 거칩니다.

Working Draft (WD)

이는 W3C 명세의 설계 단계입니다. WG는 내부 및 외부 피드백에 대응하여 명세를 반복적으로 개선합니다.

첫 번째 공식 Working Draft는 “First Public Working Draft”(FPWD)로 지정됩니다. CSSWG에서는 FPWD를 발행하는 것이 작업 그룹 전체가 에디터 초안에서 제안되고 범위가 대략 정해진 해당 모듈에 대해 작업하기로 합의했음을 의미합니다.

다음 단계로의 전환은 때때로 “Last Call Working Draft”(LCWD) 단계라고 불립니다. CSSWG는 알려진 모든 이슈를 해결했고, 테스트와 구현을 통해 얻는 피드백 없이는 더 이상 진전할 수 없게 되었을 때 Working Draft를 다음 단계로 전환합니다.

이 “Last Call for Comments”는 남아 있는 모든 이슈를 보고할 마감 기한을 설정하고, WG가 들어오는 피드백을 특별히 추적하고 처리하도록 요구합니다. 코멘트 추적 문서는 Disposition of Comments(DoC)입니다. 이는 폭넓은 검토와 수용을 입증하기 위해 업데이트된 드래프트와 함께 Director의 승인을 위해 제출됩니다.

Candidate Recommendation (CR)

이는 W3C 명세의 테스트 단계입니다. 특히 이 단계는 명세를 테스트하기 위해 테스트와 구현을 사용하는 단계이며, 구현 자체를 테스트하는 것이 아닙니다. 이 과정은 종종 명세의 더 많은 문제를 드러내며, 따라서 Candidate Recommendation은 구현 및 테스트 피드백에 대응하여 시간이 지남에 따라 변할 수 있습니다. 다만 보통 설계 단계(WD)만큼 크게 변하지는 않습니다.

CR을 종료하기 위해서는 각 기능에 대해 올바르고 독립적인 두 개의 구현을 입증해야 하므로, 이 단계에서 WG는 테스트 스위트를 구축하고 구현 보고서를 작성합니다.

다음 단계로의 전환은 “Proposed Recommendation”(PR)입니다. 이 단계 동안 W3C Advisory Committee는 REC로의 전환을 승인해야 합니다.

Recommendation (REC)

이는 W3C 명세의 완료 상태이며 유지보수 단계를 나타냅니다. 이 시점에서 WG는 정오표 문서만 유지하고, 때때로 정오표를 명세에 반영한 업데이트 판을 발행합니다.

Editor’s Draft는 에디터들이 사용 중인 작업 사본의 실시간 복사본에 해당합니다. 이는 Working Group의 합의를 반영할 수도, 반영하지 않을 수도 있으며, 때로는 자기 모순적인 상태일 수도 있습니다. (W3C에서의 발행 과정은 시간 소모가 크고 부담스럽기 때문에, Editor’s Draft는 보통 명세에 대한 최선의 (가장 최신의) 참고 자료입니다. 현재는 발행의 마찰을 줄이기 위한 노력이 진행 중이며, 그 결과 공식 초안이 정기적으로 최신 상태를 유지하게 되고 Editor’s Draft는 다시 원래의 스크래치 공간 역할로 돌아갈 수 있을 것입니다.)

2. CSS 명세의 분류

안정된 것과 진행 중인 것을 포함한 모든 CSS 모듈과 그 상태 목록은 CSS Current Work page에서 확인할 수 있습니다.

2.1. Cascading Style Sheets (CSS) — 공식 정의

이 프로필은 우리가 안정적이라고 간주하는 명세들 그리고 그러한 안정성을 확신할 수 있을 만큼의 충분한 구현 경험이 있는 명세들만 포함합니다.

Note: 이는 CSS Desktop Browser Profile을 의도한 것이 아닙니다. 이 프로필에 포함되는지는 기능 안정성만을 기준으로 하며, 예상 사용량이나 웹 브라우저 채택 여부를 기준으로 하지 않습니다. 이 프로필은 CSS를 가장 완전한 형태로 정의합니다.

2026년 현재, Cascading Style Sheets (CSS)는 다음 명세들에 의해 정의됩니다.

CSS Level 2, latest revision (including errata) [CSS2]

이는 CSS의 핵심을 정의하며, 그 일부는 이후 명세들에 의해 덮어써집니다. 특히 CSS의 기본 개념과 설계 원칙의 일부를 소개하는 Chapter 2를 읽을 것을 권장합니다.

CSS Syntax Module Level 3 [CSS-SYNTAX-3]

CSS2§4.1, CSS2§4.2, CSS2§4.4, CSS2§G를 대체하며, CSS가 어떻게 파싱되는지를 재정의합니다.

CSS Style Attributes [CSS-STYLE-ATTR]

CSS 선언을 마크업 속성 안에 포함시키는 방법을 정의합니다.

Media Queries Level 3 [CSS3-MEDIAQUERIES]

CSS2§7.3을 대체하고 미디어별 스타일을 위한 구문을 확장합니다.

CSS Conditional Rules Module Level 3 [CSS-CONDITIONAL-3]

CSS2§7.2를 확장하고 대체하며, @media 규칙의 정의를 업데이트하여 중첩을 허용하고, 기능 지원 질의를 위한 @supports 규칙을 도입합니다.

Selectors Level 3 [SELECTORS-3]

CSS2§5 및 CSS2§6.4.3을 대체하며, 확장된 범위의 셀렉터를 정의합니다.

CSS Namespaces Module Level 3 [CSS3-NAMESPACE]

네임스페이스 접두사가 붙은 셀렉터를 허용하기 위해 @namespace 규칙을 도입합니다.

CSS Cascading and Inheritance Level 4 [CSS-CASCADE-4]

CSS2§1.4.3, CSS2§6 및 [CSS-CASCADE-3]을 확장하고 대체합니다. 스타일 규칙을 모으고 모든 요소의 모든 속성에 값을 할당하는 방법을 설명합니다. 캐스케이딩과 상속을 통해 모든 요소의 모든 속성에 대한 값이 전파됩니다.

CSS Values and Units Module Level 3 [CSS-VALUES-3]

CSS2§1.4.2.1, CSS2§4.3, CSS2§A.2.1–3을 확장하고 대체하며, CSS의 속성 정의 구문을 정의하고 단위 집합을 확장합니다.

CSS Custom Properties for Cascading Variables Module Level 1 [CSS-VARIABLES-1]

모든 CSS 속성이 받아들이는 새로운 기본 값 타입으로서 캐스케이딩 변수를 도입하고, 이를 정의하기 위한 커스텀 속성을 도입합니다.

CSS Box Model Module Level 3 [CSS-BOX-3]

CSS2§8.1, §8.2, §8.3(단 §8.3.1 제외), §8.4를 대체합니다.

CSS Color Module Level 4 [CSS-COLOR-4]

CSS2§4.3.6, CSS2§14.1, CSS2§18.2를 확장하고 대체하며, 또한 [CSS-COLOR-3]를 확장하고 대체합니다. sRGB를 넘어서는 확장된 색 공간, 확장된 색 값, 색을 위한 CSS 객체 모델 확장을 도입합니다. 또한 opacity 속성을 정의합니다.

CSS Backgrounds and Borders Module Level 3 [CSS-BACKGROUNDS-3]

CSS2§8.5 및 CSS2§14.2를 확장하고 대체하며, 배경과 테두리에 대한 더 많은 제어를 제공합니다. 여기에는 다중 레이어 배경 이미지, 이미지 테두리, 드롭 섀도우가 포함됩니다.

CSS Images Module Level 3 [CSS-IMAGES-3]

외부 2D 이미지 값 타입을 재정의하고 통합하며, 네이티브 2D 그라디언트를 도입하고, 대체 요소 크기 및 렌더링을 위한 추가 제어를 제공합니다.

CSS Fonts Module Level 3 [CSS-FONTS-3]

CSS2§15를 확장하고 대체하며, 폰트 선택과 폰트 기능 선택에 대한 더 많은 제어를 제공합니다.

CSS Writing Modes Level 3 [CSS-WRITING-MODES-3]

왼쪽에서 오른쪽(예: Latin 또는 Indic), 오른쪽에서 왼쪽(예: Hebrew 또는 Arabic), 양방향(예: Latin과 Arabic 혼용), 수직(예: Asian scripts)과 같은 다양한 국제적 쓰기 모드에 대한 CSS 지원을 정의합니다. CSS2§8.6 및 §9.10을 대체하고 확장합니다.

CSS Multi-column Layout Module Level 1 [CSS-MULTICOL-1]

CSS 레이아웃에 다단 흐름을 도입합니다.

CSS Flexible Box Layout Module Level 1 [CSS-FLEXBOX-1]

CSS를 위한 유연한 선형 레이아웃 모델을 도입합니다.

CSS Basic User Interface Module Level 3 [CSS-UI-3]

CSS2§18.1 및 CSS2§18.4를 확장하고 대체하며, cursor, outline 및 여러 새로운 CSS 기능을 정의하여 사용자 인터페이스를 향상시킵니다.

CSS Containment Module Level 1 [CSS-CONTAIN-1]

contain 속성을 도입하며, 이를 통해 요소의 서브트리를 독립적으로 CSS 처리하도록 강제합니다. 이는 적절히 사용될 경우 사용자 에이전트가 강력한 최적화를 수행할 수 있게 합니다.

CSS Transforms Module Level 1 [CSS-TRANSFORMS-1]

좌표 기반의 그래픽 변형을 CSS에 도입합니다.

Compositing and Blending Level 1 [COMPOSITING]

겹쳐진 콘텐츠의 합성과 블렌딩을 정의하고, 그 모드를 제어하는 기능을 도입합니다.

CSS Easing Functions Level 1 [CSS-EASING-1].

작성자가 어떤 값의 변화율을 제어하는 변환을 정의하는 방법을 설명합니다. 애니메이션에 적용하면, 이러한 변환은 관성과 같은 물리적 현상을 모방하는 애니메이션을 만들거나 애니메이션이 이산적인 단계로 움직이게 하여 로봇 같은 움직임을 만들어낼 수 있습니다.

CSS Counter Styles Level 3 [CSS-COUNTER-STYLES-3]

@counter-style 규칙을 도입하여, 작성자가 CSS 목록 마커와 생성 콘텐츠 카운터 [CSS-LISTS-3]와 함께 사용할 사용자 지정 카운터 스타일을 정의할 수 있게 합니다. 또한 CSS2 및 CSS2.1에 존재하는 것들을 포함해, 공통적으로 사용되는 카운터 스타일 집합을 미리 정의합니다.

Note: 이 스냅샷을 구성하는 명세들에 상당한 변경이 있을 것으로 예상되지는 않지만, 포함되었다는 사실이 이들이 동결(frozen)되었음을 의미하지는 않습니다. Working Group은 이러한 명세들에서 문제가 발견되는 대로 계속해서 해결해 나갈 것입니다. 구현자는 그로 인해 생기는 변경, 수정, 명확화를 확인하기 위해 www-style 및 CSS Working Group Blog를 모니터링해야 합니다.

2.2. 신뢰할 수 있는 Candidate Recommendations

다음 명세들은 신뢰할 수 있는 상태에 있다고 간주됩니다. 이는 이들이 구현과 명세 측면에서 대체로 안정적이지만, 사소한 이슈나 추가 구현 보고서의 필요로 인해 아직 Recommendation 단계에는 도달하지 못했음을 의미합니다.

Media Queries Level 4 [MEDIAQUERIES-4]

[CSS3-MEDIAQUERIES]를 확장하고 대체하며, 구문을 확장하고, 대부분의 media 타입을 폐기 예정 상태로 만들며, 새로운 media 기능을 도입합니다.

CSS Scroll Snap Module Level 1 [CSS-SCROLL-SNAP-1]

“snap positions”을 사용하여 패닝 및 스크롤 동작을 제어하는 기능을 포함합니다.

CSS Scrollbars Styling Module Level 1 [CSS-SCROLLBARS-1]

스크롤바의 시각적 스타일에 영향을 주는 속성을 정의하며, 색상과 너비를 제어하는 수단을 도입합니다.

CSS Grid Layout Module Level 1 [CSS-GRID-1]

사용자 인터페이스 디자인에 최적화된 2차원 그리드 기반 레이아웃 시스템을 도입합니다. 그리드 레이아웃 모델에서 그리드 컨테이너의 자식들은 미리 정의된 유연 또는 고정 크기 레이아웃 그리드의 임의의 슬롯에 배치될 수 있습니다.

CSS Grid Layout Module Level 2 [CSS-GRID-2]

[CSS-GRID-1]을 확장하고 대체하며, 공유 그리드 프레임워크 안에서 중첩된 마크업을 관리하기 위한 “subgrids”를 도입합니다.

CSS Cascading and Inheritance Module Level 5 [CSS-CASCADE-5]

[CSS-CASCADE-4]를 확장하고 대체하며, 단일 origin 내에서 여러 관심사를 구조적으로 조직하고 균형 잡을 수 있게 하는 cascade layers를 도입합니다.

CSS Color Adjustment Module Level 1 [CSS-COLOR-ADJUST-1]

이 모듈은 사용자 에이전트가 사용자 선호 및 장치 출력 최적화를 처리할 수 있도록, 자동 색상 조정에 대한 모델과 제어 수단을 도입합니다.

CSS Conditional Rules Module Level 4 [CSS-CONDITIONAL-4]

지원되는 셀렉터를 테스트할 수 있도록 [CSS-CONDITIONAL-3]을 확장합니다.

2.3. 구현 경험이 제한된 비교적 안정적인 모듈

다음 모듈들은 설계 작업을 완료했고 비교적 안정적이지만, 아직 충분한 테스트와 구현 경험을 받지 못했습니다. 우리는 향후 스냅샷에서 이들을 CSS의 공식 정의에 포함시키기를 희망합니다.

CSS Display Module Level 3 [CSS-DISPLAY-3]

CSS2§9.1.2, §9.2.1(단 §9.2.1.1 제외), §9.2.2(단 §9.2.2.1 제외), §9.2.3, §9.2.4를 대체하고 (또한 §9.7을 대체하기 위한 기반을 마련하며), 문서 요소 트리로부터 CSS 포매팅 박스 트리가 어떻게 생성되는지와 이를 제어하는 display 속성을 정의합니다.

CSS Writing Modes Level 4 [CSS-WRITING-MODES-4]

[CSS-WRITING-MODES-3]를 확장하고 대체하며, 수직 쓰기를 위한 더 많은 옵션을 추가합니다.

CSS Fragmentation Module Level 3 [CSS-BREAK-3]

흐름을 페이지, 열 또는 영역으로 분할하는 단편화 모델을 설명하고, 이를 제어하는 속성들을 정의합니다. CSS2§13.3을 확장하고 대체합니다.

CSS Box Alignment Module Level 3 [CSS-ALIGN-3]

블록 레이아웃, 테이블 레이아웃, 플렉스 레이아웃, 그리드 레이아웃 등 다양한 CSS 박스 레이아웃 모델에서 컨테이너 내부의 박스 정렬을 제어하는 속성들을 도입합니다.

CSS Shapes Module Level 1 [CSS-SHAPES-1]

CSS2§9.5의 float를 확장하여 비직사각형 래핑 형태를 가능하게 합니다.

CSS Text Module Level 3 [CSS-TEXT-3]

§16.3을 제외한 CSS2§16을 확장하고 대체하며, 텍스트 조작을 위한 속성을 정의하고 그 처리 모델을 명시합니다. 줄 바꿈, 정렬과 정당화, 공백 처리, 텍스트 변환을 다룹니다.

CSS Text Decoration Module Level 3 [CSS-TEXT-DECOR-3]

CSS2§16.3을 확장하고 대체하며, 텍스트 장식선에 대한 더 많은 제어를 제공하고, 텍스트 강조 표시 및 텍스트 그림자를 지정하는 기능을 추가합니다.

CSS Masking Module Level 1 [CSS-MASKING-1]

CSS2§11.1.2를 대체하며, 콘텐츠를 클리핑하고 마스킹하는 보다 강력한 방법을 도입합니다.

CSS Speech Module Level 1 [CSS-SPEECH-1]

CSS2§A를 대체하며, (비규범적인) 음성 렌더링 장을 전면적으로 개편합니다.

CSS View Transitions Module Level 1 [CSS-VIEW-TRANSITIONS-1]

View Transition API와 그에 연관된 속성 및 의사 요소를 정의하며, 이를 통해 개발자가 문서 상태 변화를 나타내는 애니메이션 시각 전환을 만들 수 있게 합니다.

2.4. 거친 상호운용성을 가진 모듈

아래 모듈들은 rough interoperability를 가진 채 널리 배포되었지만, 세부 사항이 완전히 정리되지 않았거나 충분히 잘 명세되지 않았으며, 더 많은 테스트와 버그 수정이 필요합니다. 우리는 향후 스냅샷에서 이들을 CSS의 공식 정의에 포함시키기를 희망합니다.

CSS Transitions [CSS-TRANSITIONS-1] and CSS Animations Level 1 [CSS-ANIMATIONS-1].

CSS 속성의 계산된 값을 시간에 따라 전환시키는 메커니즘을 도입합니다.

CSS Will Change Module Level 1 [CSS-WILL-CHANGE-1]

will-change라는 성능 힌트 속성을 도입합니다.

Filter Effects Module Level 1 [FILTER-EFFECTS-1]

요소의 렌더링이 문서에 표시되기 전에 이를 처리하는 한 방법으로 필터 효과를 도입합니다.

CSS Font Loading Module Level 3 [CSS-FONT-LOADING-3]

폰트 리소스를 동적으로 로드하기 위해 사용되는 이벤트와 인터페이스를 도입합니다.

CSS Box Sizing Module Level 3 [CSS-SIZING-3]

CSS§10 위에 덧씌우고 확장하여, 크기 지정 속성들의 값 집합을 확장하고, 더 정확한 크기 지정 용어를 도입하며, CSS2에서 다소 모호하게만 정의되었던 다양한 자동 크기 지정 개념들을 더 잘 정의합니다.

CSS Transforms Module Level 2 [CSS-TRANSFORMS-2]

[CSS-TRANSFORMS-1]를 기반으로 3차원 변형을 위한 새로운 변형 함수와 속성, 단순 변형을 위한 편의 함수들을 추가합니다.

CSS Lists and Counters Module Level 3 [CSS-LISTS-3]

목록 카운터와 관련된 CSS 기능, 즉 카운터를 스타일링하고, 위치를 지정하고, 값을 조작하는 기능을 포함합니다.

CSS Logical Properties and Values Level 1 [CSS-LOGICAL-1]

물리적 방향과 치수 매핑이 아니라 논리적 방향과 치수 매핑을 통해 레이아웃을 제어할 수 있게 하는 논리 속성과 값을 도입합니다. 또한 [CSS2]에 정의된 기능들에 대해서도 논리 속성과 값을 정의합니다. 이러한 속성들은 해당 물리 속성의 쓰기 모드 상대적 등가물입니다.

CSS Positioned Layout Module Level 3 [CSS-POSITION-3]

CSS의 좌표 기반 위치 지정 및 오프셋 방식, 즉 relative positioning, sticky positioning, absolute positioning, fixed positioning을 정의합니다.

Resize Observer [RESIZE-OBSERVER-1]

이 명세는 요소의 principal box 크기 변화를 관찰하기 위한 API를 설명합니다.

Web Animations [WEB-ANIMATIONS-1]

웹 페이지 표현의 변화에 대한 동기화와 타이밍 모델을 정의합니다. 또한 이 모델과 상호작용하기 위한 애플리케이션 프로그래밍 인터페이스를 정의합니다.

CSS Fonts Module Level 4 [CSS-FONTS-4]

CSS Fonts 3을 확장하고 대체하며, OpenType variations 지원을 포함해 폰트 선택과 기능 선택에 대한 더 많은 제어를 제공합니다.

Motion Path Module Level 1 [MOTION-1]

이 모듈은 작성자가 임의의 그래픽 객체를 배치하고, 작성자가 지정한 경로를 따라 애니메이션할 수 있게 합니다.

CSS Scroll Anchoring Module Level 1 [CSS-SCROLL-ANCHORING-1]

이 모듈은 스크롤 컨테이너의 스크롤 위치를 특정 앵커 요소에 고정함으로써 콘텐츠의 갑작스러운 이동을 최소화하는 것을 목표로 합니다.

CSS Object Model (CSSOM) [CSSOM-1]

이 모듈은 CSS, Media Queries, Selectors를 파싱하고, 직렬화하고, 조작하기 위한 API를 정의합니다.

CSS Color Module Level 5 [CSS-COLOR-5]

CSS Color 4를 확장하여 색 공간과 색 수정 함수들을 추가합니다.

Selectors Level 4 [SELECTORS-4]

새로운 pseudo-classes, pseudo-elements, combinators를 도입하여 Selectors Level 3을 확장하며, 더 복잡한 기준과 상태에 기반해 요소를 선택할 수 있는 능력을 강화합니다.

CSS Containment Module Level 2 [CSS-CONTAIN-2]

CSS Containment 1을 확장하여 style containment를 추가합니다.

CSSOM View Module [CSSOM-VIEW-1]

이 모듈은 시각적 viewport와 layout viewport를 질의하고 조작하기 위한 API와, 요소를 viewport 안으로 스크롤하는 메서드들을 정의합니다.

Geometry Interfaces Module Level 1 [GEOMETRY-1]

이 모듈은 점, 직사각형, 사변형, 변환 행렬을 표현하기 위한 기본적인 기하 인터페이스들을 정의합니다.

2.5. CSS 레벨

Cascading Style Sheets는 전통적인 의미의 버전을 가지지 않으며, 대신 levels를 가집니다. 각 CSS level은 이전 level을 기반으로 정의를 다듬고 기능을 추가합니다. 더 높은 level의 기능 집합은 어떤 더 낮은 level의 기능 집합의 상위 집합이며, 주어진 기능에 대해 더 높은 level에서 허용되는 동작은 더 낮은 level에서 허용되는 동작의 부분 집합입니다. 따라서 더 높은 level의 CSS에 적합한 user agent는 모든 더 낮은 level에도 적합합니다.

CSS Level 1

CSS Working Group은 CSS1 specification을 obsolete로 간주합니다. CSS Level 1은 CSS1 명세에서 정의된 모든 기능(속성, 값, at-rules 등)을 포함하지만, CSS2.1 specification의 구문과 정의를 사용하는 것으로 정의됩니다. CSS Style Attributes는 이러한 기능이 요소별 style attributes에 포함되는 방식을 정의합니다.

CSS Level 2

비록 CSS2 specification이 기술적으로는 W3C Recommendation이지만, 이는 W3C가 Candidate Recommendation 단계를 정의하기 전에 Recommendation 단계에 도달했습니다. 시간이 지나면서 구현 경험과 추가 검토를 통해 CSS2 명세의 많은 문제가 드러났기 때문에, 이미 다루기 어려운 errata list를 확장하는 대신, CSS Working Group은 CSS Level 2 Revision 1(CSS2.1)을 정의하기로 선택했습니다. 두 명세 간에 어떤 충돌이 있는 경우, CSS2.1이 최종적인(definitive) 정의를 제공합니다.

CSS2.1이 Candidate Recommendation이 되었을 때, — 사실상(비록 공식적이지는 않지만) CSS2와 동일한 안정성 수준이 되었을 때 — CSS2 Recommendation은 obsolete가 되었습니다. CSS2에서 CSS2.1로 제외된 기능들은 Candidate Recommendation 단계에 있는 것으로 간주해야 하지만, 이들 중 많은 기능이 CSS Level 3 working draft로 옮겨졌거나 옮겨질 예정이며, 그 경우 해당 명세가 CR에 도달하면 CSS2의 정의를 obsolete로 만들 것임을 유념해야 합니다.

CSS2.1 specification은 CSS Level 2를 정의하며, CSS Style Attributes specification은 이 level이 요소별 style attributes에 포함되는 방식을 정의합니다.

CSS Level 3

CSS Level 3는 핵심으로 CSS2.1 specification을 사용하면서 module 단위로 CSS Level 2 위에 구축됩니다. 각 module은 기능을 추가하고 CSS2.1 명세의 일부를 대체합니다. CSS Working Group은 새로운 CSS 모듈이 CSS2.1 명세와 모순되지 않고, 기능을 추가하고 정의를 다듬는 방향으로만 변경되도록 하는 것을 의도합니다. 각 모듈이 완료되면, CSS2.1과 이전에 완료된 모듈들로 이루어진 기존 시스템에 플러그인되게 됩니다.

이 level부터는 모듈들이 서로 독립적으로 level을 갖습니다. 예를 들어 Selectors Level 4가 CSS Line Module Level 3보다 먼저 완료될 수 있습니다. CSS Level 2에 해당하는 모듈이 없는 경우 Level 1에서 시작하며, CSS Level 2에 존재했던 기능을 업데이트하는 모듈은 Level 3에서 시작합니다.

CSS Level 4 and beyond

CSS Level 4라는 것은 존재하지 않습니다. 개별 모듈은 Level 4 또는 그 이상에 도달할 수 있지만, CSS라는 언어 전체는 더 이상 level을 가지지 않습니다. (“CSS Level 3”라는 용어는 이전의 단일(monolithic) 버전들과 구분하기 위해서만 사용됩니다.)

2.6. CSS 프로필

모든 구현체가 CSS에 정의된 모든 기능을 구현하는 것은 아닙니다.

과거에 Working Group은 일부 Profiles를 발행한 바 있으며, 이는 여러 종류의 user agent가 지원할 것으로 기대되는 CSS의 최소 부분집합을 정의하기 위한 것이었습니다.

그러나 이 작업은 Working Group이 보기엔 효과적이거나 유용하지 않았기 때문에 중단되었으며, 이전에 정의된 profiles는 더 이상 관리되지 않습니다.

Note: CSS의 부분 구현은 그것이 비록 공식 profile의 부분집합이라 할지라도, partial implementations에 대한 forward-compatible 파싱 규칙을 따라야 합니다.

3. CSS의 책임 있는 구현 요구사항

다음 절들은 현재와 미래에 상호운용성을 촉진하는 방식으로 CSS를 책임감 있게 구현하기 위한 여러 적합성 요구사항을 정의합니다.

3.1. 부분 구현

작성자가 forward-compatible 파싱 규칙을 활용해 fallback 값을 지정할 수 있도록, CSS 렌더러는 사용 가능한 수준의 지원이 없는 모든 at-rules, 속성, 속성 값, 키워드 및 기타 구문 구조를 유효하지 않은 것으로 취급하고 (적절히 무시 해야 하며), 특히, user agent는 하나의 다중 값 속성 선언에서 지원되지 않는 속성 값을 선택적으로 무시하고 지원되는 값만을 존중해서는 안 됩니다. 어떤 값이라도 (지원되지 않는 값이 그래야 하듯이) 유효하지 않은 것으로 간주되면, CSS는 해당 선언 전체를 무시하도록 요구합니다.

3.2. 불안정·독점 기능의 구현

향후 안정적인 CSS 기능과 충돌을 피하기 위해, CSSWG는 CSS의 unstable 기능과 proprietary extensions 구현에 대해 다음 모범 사례를 권장합니다.

3.2.1. 실험 및 불안정 기능

W3C 명세에 기술되어 있지만 상호운용성이 없는 unstable 기능의 구현은 일반적인 용도를 위해 광범위하게 배포되어서는 안 되며, 제한된 실험적 용도로 통제된 환경에서 배포될 수 있습니다.

CSS 기능은 그 명세가 W3C 프로세스에서 Candidate Recommendation (CR) 단계에 도달할 때까지 unstable로 간주됩니다. 예외적인 경우, CSSWG는 공식적으로 기록된 결의를 통해 pre-CR 기능을 광범위한 배포에 안전한 것으로 간주되는 기능 집합에 추가할 수 있습니다. 자세한 내용은 § 4 Safe to Release pre-CR Exceptions를 참조하십시오.

Note: 공급업체는 이 점에 대해 WG와 명시적으로 상의해야 하며, 스스로 가정해서는 안 됩니다. 어느 정도 오랫동안 변경되지 않은 pre-CR 명세는 보통 안정적이라기보다 시대에 뒤떨어진 경우가 더 많기 때문입니다.

3.2.2. 독점 및 비표준 기능

향후 CSS 기능과의 충돌을 피하기 위해, CSS2.1 명세는 CSS에 대한 proprietary 및 experimental 확장을 위해 prefixed syntax를 예약해 두었습니다 [CSS2]. CSS 기능은 단일 공급업체의 user agent만 접근 가능한 닫힌 환경에서 사용하도록 의도된 경우 proprietary extension입니다. UA는 이러한 proprietary extensions를 vendor-prefixed 구문을 통해서만 지원해야 하며, World Wide Web과 같은 개방된(다중 UA) 환경에 노출해서는 안 됩니다.

기능이 궁극적으로는 웹에서 사용되도록 의도된 것이라 하더라도, 아직 표준화되지 않았다면 여전히 웹에 노출되어서는 안 됩니다.

3.2.3. 시장 압력 및 사실상 표준

어떤 기능이 unstable (즉, 명세가 아직 안정화되지 않은) 상태이지만,

• 최소한 세 개의 UA가 이 기능을 구현하고 있는 경우 (또는 한 UA가 다른 규칙들을 깨고 unstable하거나 비표준적인 기능을 프로덕션 릴리스에서 광범위한 용도로 배포한 경우),

• 그리고 구현들 간에 rough interoperability가 있으며,

• 그리고 CSS Working Group이 해당 기능이 존재해야 하고 배포되어야 한다는 데 대한 합의를 기록한 경우,

구현자는 해당 기능을 광범위 배포 빌드에서 unprefixed 상태로 배포할 수 있습니다. Rough interoperability는 비록 차이점이 있더라도 구현들이 충분히 비슷하여, 상당한 수의 사용 사례에 대해 프로덕션 웹사이트에서 사용될 수 있다고 판단되는 주관적 판단에 의해 충족됩니다.

CSSWG는 공급업체 간 조율을 보장하고 각 공급업체의 CSS 전문가에 의한 일관성 검토를 보장하기 위해 여전히 상의되어야 함에 유의하십시오. 또한 rough interoperability는 세부 사항이 표준 검토 절차를 통해 충분히 다듬어지지 않았기 때문에, 특히 edge(혹은 그리 edge가 아닌) 사례에서 여전히 상당한 상호운용성 부족을 의미하는 경우가 많다는 점도 유의해야 합니다.

3.2.3.1. Vendor-prefixing Unstable Features

이러한 standards-track unstable 기능을 프로덕션 릴리스에서 웹에 노출할 때, 구현체는 해당 기능에 대해 vendor-prefixed 구문과 unprefixed 구문 둘 모두를 지원해야 합니다. 기능이 안정화되고 구현이 상호운용 가능한 동작에 맞춰 업데이트되면, vendor-prefixed 구문에 대한 지원은 제거되어야 합니다.

작성자에게 unstable 기능을 홍보하는 누구든, 해당 기능을 표준 unprefixed 구문으로 문서화해야 하며, 구현 차이를 우회하기 위한 목적 이외에는 vendor-prefixed 구문의 사용을 권장하는 일을 피해야 합니다.

3.2.3.2. Preserving the Openness of CSS

CSS를 기술로서의 개방성을 유지하기 위해, 공급업체는 자신들이 배포하는 모든 기능을 다른 구현자가 자유롭게 구현할 수 있도록 해야 합니다. 이를 위해, 그런 기능의 표준화를 완성하기 위한 명세 편집 및 테스트 리소스를 제공해야 하며, 경쟁사가 해당 기능을 배포하는 것을 막을 수 있는 기타 장애물(예: 플랫폼 의존성, 라이선스 제한 등)을 피해야 합니다.

3.3. CR 단계 기능의 구현

어떤 명세가 Candidate Recommendation 단계에 도달하면, 구현자는 명세에 따라 올바르게 구현되었음을 입증할 수 있는 모든 CR-level 기능에 대해 unprefixed 구현을 배포해야 하며, 해당 기능의 prefixed 변형을 노출하는 것은 피해야 합니다.

CSS 구현 전반에서 상호운용성을 수립하고 유지하기 위해, CSS Working Group은 비실험적 CSS 렌더러가 어떤 CSS 기능을 unprefixed 구현으로 배포하기 전에 구현 보고서(필요하다면 해당 구현 보고서에 사용된 테스트케이스 포함)를 W3C에 제출해 줄 것을 요청합니다. W3C에 제출된 테스트케이스는 CSS Working Group에 의해 검토 및 수정될 수 있습니다.

CSS 명세에 대한 최신 구현 보고서는 Web Platform Tests에서 찾을 수 있으며, 이는 GitHub에서 유지관리 됩니다.

4. 사전 CR 예외의 안전한 배포

다음 기능들은 명세가 Candidate Recommendation에 도달하기 이전이라도 광범위하게 배포해도 안전하다고 CSS Working Group이 명시적이고 선제적으로 승인한 것들입니다. § 3.2.1 Experimentation and Unstable Features를 참조하십시오.

• 크기 지정 속성들 (width, height 등), border 속성들, margin 및 padding 속성들의 flow-relative 등가물. explanation과 specification을 참조하십시오.
• 크기 지정 속성들의 min-content 및 max-content 키워드. decision과 specification을 참조하십시오.
• conic-gradient() 그라디언트 표기법. decision을 참조하십시오.
• aspect-ratio 속성. [CSS-SIZING-4]
• translate, rotate, scale 속성들. [CSS-TRANSFORMS-2]
• hyphenate-character 속성. [CSS-TEXT-4]
• color-mix() 함수. [CSS-COLOR-5]
• <color-interpolation-method> 타입. [CSS-COLOR-4]에서 정의되며, 선형, 방사형, 원뿔형(conic) 그라디언트의 보간에 사용됩니다. [CSS-IMAGES-4]
• relative color 구문. [CSS-COLOR-5]에 정의됩니다.
• request url modifiers. [CSS-VALUES-5]에 정의됩니다.
• display-modes, dynamic-range, scripting, prefers-reduced-motion, prefers-reduced-transparency, prefers-contrast, forced-colors, prefers-color-scheme media 기능들. [MEDIAQUERIES-5]에 정의됩니다.
• font-tech() 및 font-format() 함수들. [CSS-CONDITIONAL-5]에 정의됩니다.
• :is(), :where(), :has() pseudo-classes 및 :not()에서의 selector lists. [SELECTORS-4]에 정의됩니다.
• text-decoration-thickness, text-underline-offset 속성들 및 text-underline-position 속성의 from-font 값. [CSS-TEXT-DECOR-4]에 정의됩니다.
• ::marker pseudo-element. [CSS-PSEUDO-4]에 정의됩니다.
• text-box-trim, text-box-edge 속성 및 이 둘을 포함하는 text-box shorthand. [CSS-INLINE-3]에 정의됩니다.
• env() 함수 및 save-area-inset-* 변수들. [CSS-ENV-1]에 정의됩니다.
• pseudo-classes :scope, :defined, :focus-within, :dir(), :any-link, :open, :popover-open, :modal, :fullscreen, :placeholder-shown, :default, :valid, :invalid, :required, :optional 및 :nth-child(), :nth-last-child() pseudo-classes에 대한 selector lists. [SELECTORS-4]에 정의됩니다.
• accent-color 속성과, auto 값 (이는 outline-color 속성용). [CSS-UI-4]에 정의됩니다.
• CSS Animations Level 1과 CSS Transitions Level 1의 모든 내용.

5. text/css 미디어 타입

이 업데이트된 등록은 RFC 2318을 폐지합니다.

Type name: text

Subtype name: css

Required parameters: none

Optional parameters: charset (아래 참고)

Encoding considerations:

  8비트 클린하지 않은 전송에서 사용할 경우,
  인용-가능(quoted-printable) 인코딩을 권장합니다.
  대부분의 문자는 CSS 구문이 되고,
  따라서 UTF-8의 US-ASCII-호환 하위 범위에
  해당합니다.

Security considerations:

  CSS는 모듈식 명세이므로,
  사용 중인 각 CSS 모듈의
  Security Considerations 섹션을
  참고해야 합니다.

Interoperability considerations:

  CSS는 다양한 컴퓨터 플랫폼,
  다양한 종류의 웹 브라우저,
  다수의 저작 도구에서 가져오기
  및 내보내기 지원을 통해
  널리 상호운용성이 검증되었습니다.

Published specification:

  https://www.w3.org/TR/css

Applications that use this media type:

  CSS는 기기, 플랫폼 및
  공급업체에 중립적이며,
  HTML 문서 서식을 위한
  다양한 웹 사용자 에이전트와
  저작 도구에서 지원됩니다.

Fragment identifier considerations:

  N/A

Additional information:

  이 타입의 폐기된 별칭 이름: N/A
  Magic number(s): N/A
  파일 확장자: .css

Person & email address to contact for further information:

  W3C CSS Working Group <www-style@w3.org>

Intended usage:

  COMMON

Restrictions on usage:

  N/A

Author: W3C CSS Working Group

Change controller: W3C

Fallback encoding: 

  웹 호환성을 위해,
  문자 인코딩을 결정할 때
  사용자 에이전트는 CSS Syntax Level 3 명세의
  "스타일시트의 fallback 인코딩 결정"
  https://www.w3.org/TR/css-syntax-3/#determine-the-fallback-encoding
  를 따릅니다.

  스타일시트 저자는 스타일시트를 UTF-8로 작성해야 하며,
  HTTP 헤더(또는 그에 준하는 방법)로
  스타일시트의 인코딩이 UTF-8로 선언되거나,
  참조 문서가 그 인코딩을 UTF-8로
  선언하도록 해야 합니다.

6. 색인

이 절들은 비규범적입니다.

6.1. 용어 색인

6.2. 선택자 색인

6.3. 앳 규칙 색인

6.4. 속성 색인

6.5. 값 색인