CSS 스타일 속성

개요

HTML [HTML401]과 SVG [SVG11] 같은 마크업 언어에서 대부분의 요소에 style 속성을 제공하며, 해당 요소에서 인라인 스타일 정보를 보유하도록 합니다. 이 문서에서는 style 속성에 적용 가능한 CSS 조각의 문법 및 해석에 대해 설명하고 있습니다.

Markup languages such as HTML [HTML401] and SVG [SVG11] provide a style attribute on most elements, to hold inline style information that applies to those elements. This draft describes the syntax and interpretation of the CSS fragment that can be used in such style attributes.

이 문서의 상태

이 섹션은 이 문서를 공개했을 때 상태에 대해 설명합니다. 다른 문서가 이 문서를 덮어쓸 가능성이 있으니 주의하시길 바랍니다. 이 문서 및 W3C에서 공개한 다른 문서의 최신 버전은 W3C technical reports index at http://www.w3.org/TR/에서 확인 가능합니다.

This section describes the status of this document at the time of its publication. Other documents may supersede this document. A list of current W3C publications and the latest revision of this technical report can be found in the W3C technical reports index at http://www.w3.org/TR/.

이 문서는 W3C 멤버, 소프트웨어 개발자, 그리고 다른 W3C 그룹 및 관계자들이 평가를 진행하여, 디렉터에 의해 W3C 권고안으로 발표했습니다. 이 문서는 안정적이며, 참고자료로 사용하거나 다른 문서에서 인용해도 좋습니다. 스펙 문서의 권고를 통해 W3C가 하는 역할은 스펙 문서에 관심을 모으고 다방면으로 퍼뜨리는 일입니다. 이를 통해 웹의 기능과 상호운용성 향상을 기대할 수 있습니다.

This document has been reviewed by W3C Members, by software developers, and by other W3C groups and interested parties, and is endorsed by the Director as a W3C Recommendation. It is a stable document and may be used as reference material or cited from another document. W3C's role in making the Recommendation is to draw attention to the specification and to promote its widespread deployment. This enhances the functionality and interoperability of the Web.

워킹 그룹의 구현 레포트를 확인하시길 바랍니다. 테스트 중 하나를 통과하지 못했지만, 이는 xml:base 및 attribute (non)ordering의 브라우저 구현체에서 발생하는 버그이며, style 속성 자체의 버그가 아닙니다. 동일한 테스트를 (HTML5의 xml serialisation에서 소개하는) HTML에서 진행했을 때, 다수의 구현체에서 통과했습니다.

Please see the Working Group's implementation report. One test is not passed, although this is due to bugs in browser implementation of xml:base and attribute (non)ordering, not the style attribute itself. The equivalent test for HTML (including the xml serialisation of HTML5) is passed by multiple implementations.

이 문서의 이전 버전에서 변경된 사항은 없습니다.

No changes to this document have been made since the previous version.

이 스펙문서에 대한 토론은, 공개 메일링 리스트(아카이브)인 www-style@w3.org (참가안내서)에서 하는 것이 바람직합니다. 메일을 보낼 때, 제목에 "css-style-attr"을 포함해주시길 바랍니다. 예를 들면, “[css-style-attr] …코멘트 요약…” 같은 형태가 바람직 할 것입니다.

The (archived) public mailing list www-style@w3.org (see instructions) is preferred for discussion of this specification. When sending e-mail, please put the text “css-style-attr” in the subject, preferably like this: “[css-style-attr] …summary of comment…”

이 문서는 Style Activity의 CSS Working Group에서 제공합니다.

This document was produced by the CSS Working Group (part of the Style Activity).

이 문서는 2004년 2월 6일 W3C 특허 정책을 따르는 그룹에서 작성하였습니다. W3C는 그룹의 성과물에 관련하여 모든 공개 특허 공개 리스트를 관리합니다. 여기에는 특허 공개에 대한 지시사항도 포함합니다. 특허에 대해서 충분한 지식이 있는 사람이, 스펙 문서의 Essential Claim(s)에 인정된다고 파악되는 경우, W3C 특허 정책 제 6장에 의거하여 정보를 공개해야 할 필요가 있습니다.

This document was produced by a group operating under the 5 February 2004 W3C Patent Policy. W3C maintains a public list of any patent disclosures made in connection with the deliverables of the group; that page also includes instructions for disclosing a patent. An individual who has actual knowledge of a patent which the individual believes contains Essential Claim(s) must disclose the information in accordance with section 6 of the W3C Patent Policy.

Table of Contents

• 1. 소개
• 2. 적합성
• 3. 문법 및 파싱
• 4. 캐스케이딩과 해석
• 5. Acknowledgments
• 6. 참고 문서
  • 표준 문서
  • 참고 정보

1. 소개

문서 포맷 중 일부는 style 속성을 문서 내 요소에 바로 적용하여 style 정보를 줄 수 있도록 허용합니다. 만약 문서 포맷이 (‘style’ 혹은 다른 이름으로 정의된) style 속성을 정의하고 있고 그 값에 CSS를 허용한다면, 이 스펙 문서에서 정의하는 style 속성의 문법 및 해석을 정의할 것입니다.

Some document formats have a style attribute to permit the author to directly apply style information to specific elements in documents. If a document format defines a style attribute (whether named ‘style’ or something else) and the attribute accepts CSS as its value, then this specification defines that style attribute’s syntax and interpretation.

<p style="color: #090; line-height: 1.2">...</p>

2. 적합성

문서나 구현체는 CSS 스타일 속성을 반드시 따라야 하지만, 1개 이상의 style 속성을 가지는 문서 언어 내에서 정의한 style 속성을 CSS와 함께 구현하였을 때 이 스펙 문서의 적합성 요구사항을 만족할 경우 CSS Style 속성의 적합성에 문제를 제기할 수 있습니다.

A document or implementation cannot conform to CSS Style Attributes alone, but can claim conformance to CSS Style Attributes if it satisfies the conformance requirements in this specification when implementing CSS together with style attribute handling as defined in a document language that has one or more CSS style attributes.

CSS Style 속성의 적합성은 두개의 클래스로 정의합니다.

Conformance to CSS Style Attributes is defined for two classes:

document

하나 이상의 요소에 적용한 style 속성을 정의하고 있는 문서 언어를 보여주는 문서.

A document represented in a document language that defines a style attribute for one or more of its elements.

interpreter

문서 및 그와 관련된 style 정보의 시맨틱을 해석가능한 사람 혹은 어떤 것. (대부분의 CSS user agents가 이 부류에 속합니다.)

Someone or something that interprets the semantics of a document and its associated style information. (Most CSS user agents fall under this category.)

적합성 요구사항은 서술적인 묘사 및 RFC 2119 용어의 조합으로 표현합니다. 키워드는 "MUST", "MUST NOT", "REQUIRED", "SHALL", "SHALL NOT", "SHOULD", "SHOULD NOT", "RECOMMENDED", "MAY" 및 "OPTIONAL"이 있으며, 이 문서의 표준 파트에서 사용하는 의미는 RFC 2119에서 설명하는 의미와 동일합니다. 그러나 가독성을 위해, 이 스펙 문서에서 이 단어들은 모두 대문자로 보이지 않을 것입니다. 이 스펙 문서에서 표준에 준하는 내용이 아니라 명시된 섹션 및 예제, 노트를 제외한 모든 내용은 표준에 준하는 내용입니다. [RFC2119]

The conformance requirements are expressed with a combination of descriptive assertions and RFC 2119 terminology. The key words "MUST", "MUST NOT", "REQUIRED", "SHALL", "SHALL NOT", "SHOULD", "SHOULD NOT", "RECOMMENDED", "MAY", and "OPTIONAL" in the normative parts of this document are to be interpreted as described in RFC 2119. However, for readability, these words do not appear in all uppercase letters in this specification. All of the text of this specification is normative except sections explicitly marked as non-normative, examples, and notes. [RFC2119]

이 스펙문서의 예제는 "for example"이라는 단어 혹은 class="example"을 이용해 따른 표준 텍스트보다 돋보이게 보여집니다:

Examples in this specification are introduced with the words "for example" or are set apart from the normative text with class="example", like this:

유용한 정보를 주는 노트는 "Note"라는 단어와 함께 시작하거나 class="note"를 이용해 다른 표준 텍스트보다 돋보이게 보여집니다:

Informative notes begin with the word "Note" and are set apart from the normative text with class="note", like this:

Note, 유용한 정보를 주는 노트입니다.

3. 문법 및 파싱

style 속성의 값은 반드시 (선언 중괄호를 제외한) CSS declaration block의 콘텐츠 문법을 따라야하며, 형식 문법은 CSS core grammar의 컨벤션과 정의 아래의 내용을 따릅니다:

The value of the style attribute must match the syntax of the contents of a CSS declaration block (excluding the delimiting braces), whose formal grammar is given below in the terms and conventions of the CSS core grammar:

declaration-list

  : S* declaration? [ ';' S* declaration? ]*

  ;

아래의 CSS 2.1 컨벤션을 주의하시길 바랍니다. 주석 토큰은 보이지 않습니다.

Note that following the CSS2.1 convention, comment tokens are not shown in the rule above.

인터프리터는 style 속성의 값을 일반 CSS 스타일 시트의 선업언 블록을 파싱할 때 쓰는 것과 같은 forward-compatible 파싱 규칙을 이용해서 파싱해야합니다. CSS 2.1 스펙의 챕터 4에서 디테일을 확인할 수 있습니다. [CSS21]

The interpreter must parse the style attribute's value using the same forward-compatible parsing rules that apply to parsing declaration block contents in a normal CSS style sheet. See chapter 4 of the CSS2.1 specification for details. [CSS21]

이 이유는 CSS style 속성 문법의 선언 목록 내에 여는 중괄호가 존재하지 않으며, style 속성의 값에 닫는 중괄호(})가 없어 style 데이터를 제거하지 않기 때문입니다. 이는 단순히 유효하지 않은 토큰입니다.

Note that because there is no open brace delimiting the declaration list in the CSS style attribute syntax, a close brace (}) in the style attribute's value does not terminate the style data: it is merely an invalid token.

4. 캐스케이딩과 해석

style 속성 내의 선언은 속성이 속해있는 요소에 적용합니다. cascade에서, 이 선언은 작성자 고유이며 다른 셀렉터보다 가장 먼저 정의된 걸로 여겨집니다. CSS 2.1에서는 스타일시트와 style 속성이 함께 cascade될 때 어떻게 작동하는지 정의합니다. [CSS21] 속성의 값을 해석할 때 스타일 데이터의 상대 URL은 스타일 속성의 요소(혹은 문서에 해당 요소의 해상도가 정의되어있지 않은 경우)를 기준으로 해결해야합니다.

The declarations in a style attribute apply to the element to which the attribute belongs. In the cascade, these declarations are considered to have author origin and a specificity higher than any selector. CSS2.1 defines how style sheets and style attributes are cascaded together. [CSS21] Relative URLs in the style data must be resolved relative to the style attribute's element (or to the document if per-element resolution is not defined) when the attribute's value is parsed.

cascading 내 차이점을 제외하고, style 속성 내의 선언문은 요소에 적용되는 CSS style 룰에 주어지는 그대로 해석해야 합니다.

Aside from the differences in cascading, the declarations in a style attribute must be interpreted exactly as if they were given in a CSS style rule that applies to the element.

CSS 워킹 그룹은 하나의 요소에 여러개의 CSS style 속성을 허용하지 않도록 강하게 권장합니다. 만약 문서 언어가 여러개의 CSS style 속성을 허용한다면, 각각을 독립적으로 해석해야하며, 다른 style 룰로 적용해야 하며, 문서 언어에 의해 정리해야 하며, 이가 아닐 경우 undefined입니다.

The CSS Working Group strongly recommends that document languages do not allow multiple CSS style attributes on a single element. If a document language allows multiple CSS style attributes, each must be parsed independently and treated as a separate style rule, the ordering of which should be defined by the document language, else is undefined.

5. Acknowledgments

Thanks to feedback from Daniel Glazman, Ian Hickson, Eric A. Meyer, Björn Höhrmann.

6. 참고 문서

표준 문서

[CSS21]

Bert Bos; et al. Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification. 7 June 2011. W3C Recommendation. URL: http://www.w3.org/TR/2011/REC-CSS2-20110607

[RFC2119]

S. Bradner. Key words for use in RFCs to Indicate Requirement Levels. Internet RFC 2119. URL: http://www.ietf.org/rfc/rfc2119.txt

참고 정보

[HTML401]

Dave Raggett; Arnaud Le Hors; Ian Jacobs. HTML 4.01 Specification. 24 December 1999. W3C Recommendation. URL: http://www.w3.org/TR/1999/REC-html401-19991224

[SVG11]

Erik Dahlström; et al. Scalable Vector Graphics (SVG) 1.1 (Second Edition). 16 August 2011. W3C Recommendation. URL: http://www.w3.org/TR/2011/REC-SVG11-20110816/