명세 전체 차례
  1. 4 HTML의 요소
    1. 4.1 루트 요소
      1. 4.1.1 html 요소
    2. 4.2 문서의 메타데이터
      1. 4.2.1 head 요소
      2. 4.2.2 title 요소
      3. 4.2.3 base 요소
      4. 4.2.4 link 요소
      5. 4.2.5 meta 요소
        1. 4.2.5.1 표준 메타데이터 이름
        2. 4.2.5.2 기타 메타데이터 이름
        3. 4.2.5.3 프라그마 디렉티브
        4. 4.2.5.4 기타 프라그마 디렉티브
        5. 4.2.5.5 문서의 문자 인코딩 명시
      6. 4.2.6 The style element
      7. 4.2.7 스타일링

4 HTML의 요소

4.1 루트 요소

4.1.1 html 요소

요소가 속하는 범주Categories

없음None.

이 요소가 사용될 수 있는 문맥Contexts in which this element can be used

문서의 루트 요소

As the root element of a document.

복합 문서에서 서브문서가 허용되는 곳

Wherever a subdocument fragment is allowed in a compound document.

이 요소가 포함할 수 있는 것Content model

head 요소와, 그 뒤에 있는 body 요소

A head element followed by a body element.

요소에 쓸 수 있는 속성Content attributes

전역 속성Global attributes

manifest
DOM 인터페이스DOM interface
interface HTMLHtmlElement : HTMLElement {};

html 요소는 HTML 문서의 루트를 나타냅니다

The html element represents the root of an HTML document.

manifest 속성은 문서의 애플리케이션 캐쉬 매니페스트 주소를 나타냅니다. 이 속성이 존재한다면 그 값은 유효한, 앞뒤로 공백을 허용하는 URL을 사용해야 합니다.

The manifest attribute gives the address of the document's application cache manifest, if there is one. If the attribute is present, the attribute's value must be a valid non-empty URL potentially surrounded by spaces.

manifest 속성은 문서가 로드되는 초기 단계에만 효과가 있습니다. 따라서 이 속성을 동적으로 변경해도 아무 효과도 없습니다(DOM API도 지원되지 않습니다).

The manifest attribute only has an effect during the early stages of document load. Changing the attribute dynamically thus has no effect (and thus, no DOM API is provided for this attribute).

애플리케이션 캐쉬를 선택할 때 base 요소는 manifest 속성에 있는 상대 URL의 해석에는 아무 영향도 없습니다. base 요소는 manifest 속성이 처리된 이후에 나타나기 때문입니다.

For the purposes of application cache selection, later base elements cannot affect the resolving of relative URLs in manifest attributes, as the attributes are processed before those elements are seen.

IDL 속성 window.applicationCache는 스크립트를 통해 오프라인 상태인 애플리케이션 캐쉬 메커니즘에 접근할 방법을 제공합니다.

The window.applicationCache IDL attribute provides scripted access to the offline application cache mechanism.

아래 예제의 html 요소는 해당 문서의 언어가 영어라고 선언합니다.

The html element in the following example declares that the document's language is English.

<!DOCTYPE html>
<html lang="en">
<head>
<title>Swapping Songs</title>
</head>
<body>
<h1>Swapping Songs</h1>
<p>Tonight I swapped some of the songs I wrote with some friends, who
gave me some of the songs they wrote. I love sharing my music.</p>
</body>
</html>

4.2 문서의 메타데이터

4.2.1 head 요소

요소가 속하는 범주Categories

없음None.

이 요소가 사용될 수 있는 문맥Contexts in which this element can be used
As the first element in an html element.
이 요소가 포함할 수 있는 것Content model
If the document is an iframe srcdoc document or if title information is available from a higher-level protocol: Zero or more elements of metadata content.
Otherwise: One or more elements of metadata content, of which exactly one is a title element.
요소에 쓸 수 있는 속성Content attributes

전역 속성Global attributes

DOM 인터페이스DOM interface
interface HTMLHeadElement : HTMLElement {};

head 요소는 Document에 사용되는 메타데이터 집합을 나타냅니다.

The head element represents a collection of metadata for the Document.

head 요소 내부의 메타데이터 집합은 클 수도, 작을 수도 있습니다. 아주 작은 경우의 예를 들어 봅니다.

The collection of metadata in a head element can be large or small. Here is an example of a very short one:

<!doctype html>
<html>
 <head>
  <title>A document with a short head</title>
 </head>
 <body>
 ...

이것은 좀 더 많은 메타데이터를 사용합니다.

Here is an example of a longer one:

<!DOCTYPE HTML>
<HTML>
 <HEAD>
  <META CHARSET="UTF-8">
  <BASE HREF="http://www.example.com/">
  <TITLE>An application with a long head</TITLE>
  <LINK REL="STYLESHEET" HREF="default.css">
  <LINK REL="STYLESHEET ALTERNATE" HREF="big.css" TITLE="Big Text">
  <SCRIPT SRC="support.js"></SCRIPT>
  <META NAME="APPLICATION-NAME" CONTENT="Long headed application">
 </HEAD>
 <BODY>
 ...

거의 모든 경우에 title 요소를 포함해야 하지만 HTML으로 쓴 이메일의 제목 줄 처럼 상위 레벨의 프로토콜에서 타이틀 정보를 얻을 수 있을 때는 title 요소를 생략할 수 있습니다.

The title element is a required child in most situations, but when a higher-level protocol provides title information, e.g. in the Subject line of an e-mail when HTML is used as an e-mail authoring format, the title element can be omitted.

4.2.2 title 요소

요소가 속하는 범주Categories

메타데이터.Metadata content.

이 요소가 사용될 수 있는 문맥Contexts in which this element can be used

head 요소 내부. 다른 title 요소가 없어야 합니다.

In a head element containing no other title elements.

이 요소가 포함할 수 있는 것Content model

텍스트.Text.

요소에 쓸 수 있는 속성Content attributes

전역 속성Global attributes

DOM 인터페이스DOM interface
interface HTMLTitleElement : HTMLElement {
           attribute DOMString text;
};

title 요소는 문서의 제목, 혹은 이름을 나타냅니다. 저자들은 title 요소가 브라우징 문맥 밖 - 예를 들어 사용자 에이전트의 히스토리 리스트, 북마크, 혹은 검색엔진의 결과 - 에서도 문서를 식별할 수 있도록 사용하여야 합니다. 문서의 타이틀은 종종 첫 헤딩과는 다른데, 첫 헤딩은 문맥 바깥으로 꺼냈을 경우에도 혼자서 의미를 가질 필요는 없기 때문입니다.

The title element represents the document's title or name. Authors should use titles that identify their documents even when they are used out of context, for example in a user's history or bookmarks, or in search results. The document's title is often different from its first heading, since the first heading does not have to stand alone when taken out of context.

title 요소는 하나의 문서에 하나만 존재할 수 있습니다.

There must be no more than one title element per document.

title . text [ = value ]

요소의 내용을 반환하되 텍스트 노드가 아닌 자식 노드는 제외합니다.

Returns the contents of the element, ignoring child nodes that aren't text nodes.

요소의 자식 요소를 대체하기 위해 사용할 수 있습니다.

Can be set, to replace the element's children with the given value.

The IDL attribute text must return a concatenation of the contents of all the text nodes that are direct children of the title element (ignoring any other nodes such as comments or elements), in tree order. On setting, it must act the same way as the textContent IDL attribute.

여기에 몇가지 적당한 타이틀 예가 있습니다. 문서의 최상위 헤딩과는 대조적입니다.

Here are some examples of appropriate titles, contrasted with the top-level headings that might be used on those same pages.

<title>Introduction to The Mating Rituals of Bees</title>
    ...
  <h1>Introduction</h1>
  <p>This companion guide to the highly successful
  <cite>Introduction to Medieval Bee-Keeping</cite> book is...

다음의 페이지는 같은 사이트의 일부분일 수 있습니다. 타이틀이 주제의 내용을 모호하지 않게 설명하는 방법을 눈여겨 보십시오. 첫 헤딩은 독자들이 문맥을 이해하고 있으므로 dance가 살사 댄스인지 왈츠인지 혼동하지 않을 거라고 가정합니다. 역주

The next page might be a part of the same site. Note how the title describes the subject matter unambiguously, while the first heading assumes the reader knows what the context is and therefore won't wonder if the dances are Salsa or Waltz:

<title>Dances used during bee mating rituals</title>
    ...
  <h1>The Dances</h1>

문서의 타이틀로 사용할 문자열은 IDL 속성 document.title을 통해 주어집니다.

The string to use as the document's title is given by the document.title IDL attribute.

User agents should use the document's title when referring to the document in their user interface. When the contents of a title element are used in this way, the directionality of that title element should be used to set the directionality of the document's title in the user interface.

4.2.3 base 요소

요소가 속하는 범주Categories

메타데이터.Metadata content.

이 요소가 사용될 수 있는 문맥Contexts in which this element can be used

head 요소 내부에서, 다른 base 요소 없이 단독으로.

In a head element containing no other base elements.

이 요소가 포함할 수 있는 것Content model

이 요소는 비어 있어야 합니다.Empty.

요소에 쓸 수 있는 속성Content attributes

전역 속성Global attributes

href
target
DOM 인터페이스DOM interface
interface HTMLBaseElement : HTMLElement {
           attribute DOMString href;
           attribute DOMString target;
};

base 요소는 저자들이 문서의 베이스 URL을 명시할 수 있게 합니다. 베이스 URL은 상대 URL을 해석하는 용도로 사용되며, 또한 하이퍼링크를 따라갈 때 기본 브라우징 문맥의 이름을 제공하는 용도로 사용됩니다. 이 요소는 이러한 정보 이외의 어떠한 것도 나타내지 않습니다.

The base element allows authors to specify the document base URL for the purposes of resolving relative URLs, and the name of the default browsing context for the purposes of following hyperlinks. The element does not represent any content beyond this information.

문서 하나에 하나의 base 요소만 사용할 수 있습니다.

There must be no more than one base element per document.

base 요소는 href 속성이나 target 속성 중 하나는 반드시 가져야 하며, 둘 다 사용할 수도 있습니다.

A base element must have either an href attribute, a target attribute, or both.

href 속성의 값은 반드시 유효한, 앞뒤로 공백을 허용하는 URL이어야 합니다.

The href content attribute, if specified, must contain a valid URL potentially surrounded by spaces.

base 요소에 href 속성을 사용했다면 속성에 URL이 있는 모든 요소 앞에 있어야 합니다. 단 html 요소는 예외입니다.(manifest 속성은 base 요소의 영향을 받지 않습니다)

A base element, if it has an href attribute, must come before any other elements in the tree that have attributes defined as taking URLs, except the html element (its manifest attribute isn't affected by base elements).

If there are multiple base elements with href attributes, all but the first are ignored.

target 속성을 사용했다면 그 값은 반드시 유효한 브라우징 문맥 이름 또는 키워드여야 합니다. target 속성의 값은 Document하이퍼링크navigation을 만들 때 기본값으로 사용할 브라우징 문맥을 명시합니다.

The target attribute, if specified, must contain a valid browsing context name or keyword, which specifies which browsing context is to be used as the default when hyperlinks and forms in the Document cause navigation.

base 요소에 target 속성을 썼면 base 요소는 하이퍼링크를 나타내는 모든 요소 앞에 있어야 합니다.

A base element, if it has a target attribute, must come before any elements in the tree that represent hyperlinks.

If there are multiple base elements with target attributes, all but the first are ignored.

The href IDL attribute, on getting, must return the page's document base URL, and on setting, it must set the href content attribute to the given new value.

The target IDL attribute must reflect the content attribute of the same name.

이 예제에서는 base 요소를 사용해 문서의 베이스 URL을 설정했습니다.

In this example, a base element is used to set the document base URL:

<!DOCTYPE html>
<html>
    <head>
        <title>This is an example for the &lt;base&gt; element</title>
        <base href="http://www.example.com/news/index.html">
    </head>
    <body>
        <p>Visit the <a href="archives.html">archives</a>.</p>
    </body>
</html>

예제의 링크는 "http://www.example.com/news/archives.html"를 가리키게 됩니다.

The link in the above example would be a link to "http://www.example.com/news/archives.html".

요소가 속하는 범주Categories

메타데이터.Metadata content.

이 요소가 사용될 수 있는 문맥Contexts in which this element can be used

메타데이터를 쓸 수 있는 곳

Where metadata content is expected.

head 요소의 자손인 noscript 요소의 내부

In a noscript element that is a child of a head element.

이 요소가 포함할 수 있는 것Content model

이 요소는 비어 있어야 합니다.Empty.

요소에 쓸 수 있는 속성Content attributes

전역 속성Global attributes

href
rel
media
hreflang
type
sizes

또한, title 속성은 이 요소에서 독특한 의미를 가집니다.

Also, the title attribute has special semantics on this element.

DOM 인터페이스DOM interface
interface HTMLLinkElement : HTMLElement {
           attribute boolean disabled;
           attribute DOMString href;
           attribute DOMString rel;
  readonly attribute DOMTokenList relList;
           attribute DOMString media;
           attribute DOMString hreflang;
           attribute DOMString type;
  [PutForwards=value] readonly attribute DOMSettableTokenList sizes;
};
HTMLLinkElement implements LinkStyle;

link 요소는 다른 자원과의 연결을 만듭니다.

The link element allows authors to link their document to other resources.

href 속성으로 링크의 목적지를 나타냅니다. 이 속성은 반드시 존재해야 하고 속성의 값에는 유효한, 앞뒤로 공백을 허용하고 비어 있지 않은 URL을 사용해야 합니다. href 속성이 없다면 요소는 링크를 정의하지 않습니다.

The destination of the link(s) is given by the href attribute, which must be present and must contain a valid non-empty URL potentially surrounded by spaces. If the href attribute is absent, then the element does not define a link.

link 요소에는 반드시 rel 속성이 있어야 합니다.

A link element must have rel attribute.

rel 속성이 링크가 형성하는 관계를 나타냅니다. 이 속성은 반드시 존재해야 하고 속성의 값에는 공백문자로 구분된 토큰의 목록을 사용해야 합니다. 허용되는 값과 그 의미는 이후 섹션에서 정의됩니다. rel 속성이 없거나 그 값이 이 명세의 정의에서 허용되지 않는 값이라면 요소는 링크를 정의하지 않습니다.

The types of link indicated (the relationships) are given by the value of the rel attribute, which, if present, must have a value that is a set of space-separated tokens. The allowed keywords and their meanings are defined in a later section. If the rel attribute is absent, has no keywords, or if none of the keywords used are allowed according to the definitions in this specification, then the element does not create any links.

link 요소를 이용하여 두 가지 링크를 생성할 수 있습니다. 외부 자원으로의 링크하이퍼링크입니다. 링크 타입 섹션에서 각 링크가 외부 자원으로의 링크인지 하이퍼링크인지 정의합니다. link 요소 하나는 링크 여럿(일부는 외부 자원으로, 일부는 하이퍼링크로)을 형성할 수 있는데, 정확히 어떤 링크가 몇 개 형성되는지는 rel 속성의 예약어에 따라 다릅니다. 사용자 에이전트는 반드시 이러한 링크들을 링크 단위로 처리해야 하며, 요소 단위로 처리해서는 안됩니다.

Two categories of links can be created using the link element: Links to external resources and hyperlinks. The link types section defines whether a particular link type is an external resource or a hyperlink. One link element can create multiple links (of which some might be external resource links and some might be hyperlinks); exactly which and how many links are created depends on the keywords given in the rel attribute. User agents must process the links on a per-link basis, not a per-element basis.

각 링크는 별도로 다루어집니다. 예를 들어 rel="stylesheet" 로 정의된 link 요소가 두 개 있다면 그 둘은 별개의 외부 자원으로 간주되며 각 속성에 따라 독립적으로 영향을 받습니다. 비슷하게 link 요소의 rel 속성에 next stylesheet라는 값이 있다면, 이 요소는 하이퍼링크(next 키워드에 의해)를 형성하는 동시에 외부 자원으로의 링크(stylesheet 키워드에 의해)를 형성하며, 각 링크는 다른 속성들(media, title 등)에 의해 각각 다르게 영향받습니다.

Each link created for a link element is handled separately. For instance, if there are two link elements with rel="stylesheet", they each count as a separate external resource, and each is affected by its own attributes independently. Similarly, if a single link element has a rel attribute with the value next stylesheet, it creates both a hyperlink (for the next keyword) and an external resource link (for the stylesheet keyword), and they are affected by other attributes (such as media or title) differently.

외부 자원으로의 링크는 해당 링크 타입에 정의된 관계에 따라 동작합니다. 일부 속성은 외부 자원이 적용될지의 여부를 조절합니다(아래에 정의합니다).

The exact behavior for links to external resources depends on the exact relationship, as defined for the relevant link type. Some of the attributes control whether or not the external resource is to be applied (as defined below).

For external resources that are represented in the DOM (for example, style sheets), the DOM representation must be made available even if the resource is not applied. To obtain the resource, the user agent must run the following steps:

  1. If the href attribute's value is the empty string, then abort these steps.

  2. Resolve the URL given by the href attribute, relative to the element.

  3. If the previous step fails, then abort these steps.

  4. Fetch the resulting absolute URL.

User agents may opt to only try to obtain such resources when they are needed, instead of pro-actively fetching all the external resources that are not applied.

The semantics of the protocol used (e.g. HTTP) must be followed when fetching external resources. (For example, redirects will be followed and 404 responses will cause the external resource to not be applied.)

Once the attempts to obtain the resource and its critical subresources are complete, the user agent must, if the loads were successful, queue a task to fire a simple event named load at the link element, or, if the resource or one of its critical subresources failed to completely load for any reason (e.g. DNS error, HTTP 404 response, a connection being prematurely closed, unsupported Content-Type), queue a task to fire a simple event named error at the link element. Non-network errors in processing the resource or its subresources (e.g. CSS parse errors, PNG decoding errors) are not failures for the purposes of this paragraph.

The task source for these tasks is the DOM manipulation task source.

The element must delay the load event of the element's document until all the attempts to obtain the resource and its critical subresources are complete. (Resources that the user agent has not yet attempted to obtain, e.g. because it is waiting for the resource to be needed, do not delay the load event.)


Interactive user agents may provide users with a means to follow the hyperlinks created using the link element, somewhere within their user interface. The exact interface is not defined by this specification, but it could include the following information (obtained from the element's attributes, again as defined below), in some form or another (possibly simplified), for each hyperlink created with each link element in the document:

User agents could also include other information, such as the type of the resource (as given by the type attribute).

link 요소와 rel 속성으로 생성한 하이퍼링크는 문서 전체에 적용됩니다. 이러한 특징은 a 요소와 area 요소에서 사용하는 rel 속성과는 다릅니다. a 요소와 area 요소에서 사용하는 rel 속성은 문서 내에서 링크 위치에 의해 정해지는 문맥에 따라 링크의 타입을 나타냅니다.

Hyperlinks created with the link element and its rel attribute apply to the whole page. This contrasts with the rel attribute of a and area elements, which indicates the type of a link whose context is given by the link's location within the document.

media 속성은 자원이 어떤 매체에 적용되는지 나타냅니다. 이 값은 반드시 유효한 미디어 쿼리여야 합니다.

The media attribute says which media the resource applies to. The value must be a valid media query.

If the link is a hyperlink then the media attribute is purely advisory, and describes for which media the document in question was designed.

However, if the link is an external resource link, then the media attribute is prescriptive. The user agent must apply the external resource when the media attribute's value matches the environment and the other relevant conditions apply, and must not apply it otherwise.

The external resource might have further restrictions defined within that limit its applicability. For example, a CSS style sheet might have some @media blocks. This specification does not override such further restrictions or requirements.

media 속성을 생략하면 기본값인 "all"이 적용됩니다. 링크가 모든 매체에 적용됨을 의미합니다.

The default, if the media attribute is omitted, is "all", meaning that by default links apply to all media.

hreflang 속성은 aarea 요소의 hreflang 속성과 같은 의미입니다.

The hreflang attribute on the link element has the same semantics as the hreflang attribute on a and area elements.

type 속성은 링크된 자원의 MIME 타입을 제공합니다. 이것은 순수하게 조언적인 것입니다. 값은 반드시 유효한 MIME 타입이어야 하며, 매개변수는 옵션입니다.

The type attribute gives the MIME type of the linked resource. It is purely advisory. The value must be a valid MIME type.

외부 자원으로의 링크에서 type 속성은 사용자 에이전트가 지원하지 않는 자원은 가져오지 않도록 힌트를 제공합니다.

For external resource links, the type attribute is used as a hint to user agents so that they can avoid fetching resources they do not support. If the attribute is present, then the user agent must assume that the resource is of the given type (even if that is not a valid MIME type, e.g. the empty string). If the attribute is omitted, but the external resource link type has a default type defined, then the user agent must assume that the resource is of that type. If the UA does not support the given MIME type for the given link relationship, then the UA should not obtain the resource; if the UA does support the given MIME type for the given link relationship, then the UA should obtain the resource at the appropriate time as specified for the external resource link's particular type. If the attribute is omitted, and the external resource link type does not have a default type defined, but the user agent would obtain the resource if the type was known and supported, then the user agent should obtain the resource under the assumption that it will be supported.

User agents must not consider the type attribute authoritative — upon fetching the resource, user agents must not use the type attribute to determine its actual type. Only the actual type (as defined in the next paragraph) is used to determine whether to apply the resource, not the aforementioned assumed type.

The stylesheet link type defines rules for processing the resource's Content-Type metadata.

Once the user agent has established the type of the resource, the user agent must apply the resource if it is of a supported type and the other relevant conditions apply, and must ignore the resource otherwise.

If a document contains style sheet links labeled as follows:

<link rel="stylesheet" href="A" type="text/plain">
<link rel="stylesheet" href="B" type="text/css">
<link rel="stylesheet" href="C">

...then a compliant UA that supported only CSS style sheets would fetch the B and C files, and skip the A file (since text/plain is not the MIME type for CSS style sheets).

For files B and C, it would then check the actual types returned by the server. For those that are sent as text/css, it would apply the styles, but for those labeled as text/plain, or any other type, it would not.

If one of the two files was returned without a Content-Type metadata, or with a syntactically incorrect type like Content-Type: "null", then the default type for stylesheet links would kick in. Since that default type is text/css, the style sheet would nonetheless be applied.

title 속성은 링크에 제목을 부여합니다. 한가지 예외를 빼면 이 속성은 순수하게 조언적입니다. 값은 텍스트입니다. 스타일시트 링크는 예외인데, 스타일시트 링크의 title 속성은 대체 스타일시트 목록을 설정합니다.

The title attribute gives the title of the link. With one exception, it is purely advisory. The value is text. The exception is for style sheet links, where the title attribute defines alternative style sheet sets.

link 요소의 title 속성은 다른 요소의 title 속성과 다릅니다. 링크에 타이틀을 사용하지 않아도 부모 요소의 타이틀을 상속하지 않습니다 - 타이틀이 정의되지 않습니다.

The title attribute on link elements differs from the global title attribute of most other elements in that a link without a title does not inherit the title of the parent element: it merely has no title.

sizes 속성은 icon 링크 타입과 함께 사용합니다. 이 속성은 icon 키워드가 없는 rel 속성과 함께 사용될 수 없습니다.

The sizes attribute is used with the icon link type. The attribute must not be specified on link elements that do not have a rel attribute that specifies the icon keyword.

HTTP Link: headers, if supported, must be assumed to come before any links in the document, in the order that they were given in the HTTP entity header. (URLs in these headers are to be processed and resolved according to the rules given in the relevant specification; the rules of this specification don't apply.) [HTTP] [WEBLINK]

The IDL attributes href, rel, media, hreflang, and type, and sizes each must reflect the respective content attributes of the same name.

The IDL attribute relList must reflect the rel content attribute.

IDL 속성 disabled는 스타일시트 링크에만 적용됩니다. link 요소가 스타일시트 링크를 생성한다면 disabled 속성은 대체 스타일시트 DOM에서 정의된 것 처럼 행동합니다. 다른 link 요소들에서는 항상 false를 반환하며 아무것도 설정하지 않습니다.

The IDL attribute disabled only applies to style sheet links. When the link element defines a style sheet link, then the disabled attribute behaves as defined for the alternative style sheets DOM. For all other link elements it always return false and does nothing on setting.

LinkStyle 인터페이스 역시 이 요소에 의해 구현됩니다. 스타일 프로세싱 모델이 방법을 정의합니다. [CSSOM]

The LinkStyle interface is also implemented by this element; the styling processing model defines how. [CSSOM]

link 요소의 집합이 몇가지 스타일시트를 제공하고 있습니다.

Here, a set of link elements provide some style sheets:

<!-- a persistent style sheet -->
<link rel="stylesheet" href="default.css">

<!-- the preferred alternate style sheet -->
<link rel="stylesheet" href="green.css" title="Green styles">

<!-- some alternate style sheets -->
<link rel="alternate stylesheet" href="contrast.css" title="High contrast">
<link rel="alternate stylesheet" href="big.css" title="Big fonts">
<link rel="alternate stylesheet" href="wide.css" title="Wide screen">

다른 언어, 다른 매체를 위한 대체 포맷을 사용하는 버전들을 명시하는 방법입니다.

The following example shows how you can specify versions of the page that use alternative formats, are aimed at other languages, and that are intended for other media:

<link rel=alternate href="/en/html" hreflang=en type=text/html title="English HTML">
<link rel=alternate href="/fr/html" hreflang=fr type=text/html title="French HTML">
<link rel=alternate href="/en/html/print" hreflang=en type=text/html media=print title="English HTML (for printing)">
<link rel=alternate href="/fr/html/print" hreflang=fr type=text/html media=print title="French HTML (for printing)">
<link rel=alternate href="/en/pdf" hreflang=en type=application/pdf title="English PDF">
<link rel=alternate href="/fr/pdf" hreflang=fr type=application/pdf title="French PDF">

4.2.5 meta 요소

요소가 속하는 범주Categories

메타데이터.Metadata content.

이 요소가 사용될 수 있는 문맥Contexts in which this element can be used

charset 속성이 있거나 요소의 http-equiv 속성이 인코딩 선언 상태일 때 : head 요소 내부

If the charset attribute is present, or if the element's http-equiv attribute is in the Encoding declaration state: in a head element.

http-equiv 속성이 있지만 인코딩 선언 상태는 아닐 때 : head 요소 내부

If the http-equiv attribute is present but not in the Encoding declaration state: in a head element.

http-equiv 속성이 있지만 인코딩 선언 상태는 아닐 때 : head 요소의 자식 요소인 noscript 요소 내부

If the http-equiv attribute is present but not in the Encoding declaration state: in a noscript element that is a child of a head element.

name 속성이 있을 때 : 메타데이터를 쓸 수 있는 곳

If the name attribute is present: where metadata content is expected.

이 요소가 포함할 수 있는 것Content model

이 요소는 비어 있어야 합니다.Empty.

요소에 쓸 수 있는 속성Content attributes

전역 속성Global attributes

name
http-equiv
content
charset
DOM 인터페이스DOM interface
interface HTMLMetaElement : HTMLElement {
           attribute DOMString name;
           attribute DOMString httpEquiv;
           attribute DOMString content;
};

meta 요소는 title, base, link, style, script 요소로 표현할 수 없는 다양한 메타데이터 정보를 나타냅니다.

The meta element represents various kinds of metadata that cannot be expressed using the title, base, link, style, and script elements.

meta 요소는 name 속성을 통해 문서 수준의 메타데이터를 나타내고, http-equiv 속성을 통해 pragma directive를, 그리고 charset 속성을 통해 HTML 문서가 직렬화되었을 경우 그 파일의 문자 인코딩 선언을 나타냅니다. 역주

The meta element can represent document-level metadata with the name attribute, pragma directives with the http-equiv attribute, and the file's character encoding declaration when an HTML document is serialized to string form (e.g. for transmission over the network or for disk storage) with the charset attribute.

name, http-equiv, charset 중 단 하나만 쓸 수 있습니다.

Exactly one of the name, http-equiv, and charset attributes must be specified.

name 또는 http-equiv 속성을 썼다면 content 속성 역시 반드시 써야 합니다. name 또는 http-equiv 속성 중 아무것도 없다면 content 속성 역시 반드시 생략해야 합니다.

If either name or http-equiv is specified, then the content attribute must also be specified. Otherwise, it must be omitted.

charset 속성은 문서에서 사용하는 문자 인코딩 방식을 명시합니다. 이것이 문자 인코딩 선언입니다. 이 속성을 XML 문서에 썼다면 속성의 값은 반드시 아스키, 대소문자 구분 없이 "UTF-8"이어야 합니다(따라서 문서의 문자 인코딩 방식은 UTF-8이 됩니다).

The charset attribute specifies the character encoding used by the document. This is a character encoding declaration. If the attribute is present in an XML document, its value must be an ASCII case-insensitive match for the string "UTF-8" (and the document is therefore forced to use UTF-8 as its encoding).

meta 요소의 charset 속성은 XML 문서에서는 효과가 없으며 XHTML 문서와의 이동을 위해서만 허용됩니다.

The charset attribute on the meta element has no effect in XML documents, and is only allowed in order to facilitate migration to and from XHTML.

charset 속성을 가진 meta 요소는 문서당 단 하나만 허용됩니다.

There must not be more than one meta element with a charset attribute per document.

meta 요소를 통해 문서 메타데이터나 pragma directive를 나타내려 한다면 content 속성에 문서 메타데이터나 pragma directive의 값을 명시합니다. 허용된 값은 정확한 문맥에 따라 다르며, 이 명세의 해당 섹션에서 설명됩니다.

The content attribute gives the value of the document metadata or pragma directive when the element is used for those purposes. The allowed values depend on the exact context, as described in subsequent sections of this specification.

meta 요소에 name 속성이 있으면 meta 요소는 문서의 메타데이터를 설정합니다. 문서의 메타데이터는 이름/값 쌍으로 표현되는데 meta 요소의 name 속성이 그 이름을 나타내고 content 속성이 값을 나타냅니다. 이름은 메타데이터가 설정되는 관점을 명시하는데, 유효한 이름과 그 값의 의미는 이어지는 섹션에서 설명합니다. meta 요소에 content 속성이 없으면 값이 없는 것이고 메타데이터의 이름/값 쌍은 빈 문자열이 됩니다.

If a meta element has a name attribute, it sets document metadata. Document metadata is expressed in terms of name/value pairs, the name attribute on the meta element giving the name, and the content attribute on the same element giving the value. The name specifies what aspect of metadata is being set; valid names and the meaning of their values are described in the following sections. If a meta element has no content attribute, then the value part of the metadata name/value pair is the empty string.

The name and content IDL attributes must reflect the respective content attributes of the same name. The IDL attribute httpEquiv must reflect the content attribute http-equiv.

4.2.5.1 표준 메타데이터 이름

이 명세는 meta 요소의 name 속성에 대해 몇개의 이름을 정의합니다.

This specification defines a few names for the name attribute of the meta element.

이름들은 대소문자를 구분하지 않습니다.

Names are case-insensitive, and must be compared in an ASCII case-insensitive manner.

application-name

값은 페이지가 나타내는 웹 애플리케이션의 이름인 짧은 문자열이어야 합니다. 형식에는 제한이 없습니다. 페이지가 웹 애플리케이션이 아니면 이 메타데이터를 사용하지 말아야 합니다. name 속성의 값이 application-namemeta 요소는 문서당 하나만 허용됩니다. 사용자 에이전트는 페이지의 title 요소보다 이것을 인터페이스에 나타내도 좋은데, title은 단순한 애플리케이션 이름보다는 특정 시점에서 그 페이지의 상태, 또는 그와 연관된 정보들을 포함할수도 있기 때문입니다.

The value must be a short free-form string giving the name of the Web application that the page represents. If the page is not a Web application, the application-name metadata name must not be used. There must not be more than one meta element with its name attribute set to the value application-name per document. User agents may use the application name in UI in preference to the page's title, since the title might include status messages and the like relevant to the status of the page at a particular moment in time instead of just being the name of the application.

author

페이지의 저자를 나타내는 문자열을 써야 합니다. 형식에는 제한이 없습니다.

The value must be a free-form string giving the name of one of the page's authors.

description

페이지를 설명하는 문자열이어야 합니다. 형식에는 제한이 없습니다. 값은 검색엔진 등에서 페이지의 디렉터리로 사용하기 적합한 것이어야 합니다. name 속성의 값이 descriptionmeta 요소는 문서당 하나만 허용됩니다.

The value must be a free-form string that describes the page. The value must be appropriate for use in a directory of pages, e.g. in a search engine. There must not be more than one meta element with its name attribute set to the value description per document.

generator

값은 문서를 생성한 프로그램들 중 하나를 설명하는 문자열이어야 합니다. 형식에는 제한이 없습니다. 손으로 직접 코딩한 페이지에서는 이 값을 사용하지 말아야 합니다.

The value must be a free-form string that identifies one of the software packages used to generate the document. This value must not be used on hand-authored pages.

"Frontweaver"라 불리는 저작도구가, 페이지의 head 요소 내부에 포함시킬만한 것입니다.

Here is what a tool called "Frontweaver" could include in its output, in the page's head element, to identify itself as the tool used to generate the page:

<meta name=generator content="Frontweaver 8.2">
keywords

값은 콤마로 구분된 토큰의 목록이어야 하며, 각 토큰은 페이지와 관계 있는 키워드여야 합니다.

The value must be a set of comma-separated tokens, each of which is a keyword relevant to the page.

사용자들이 페이지를 검색하기 위해 사용할 만한 몇가지 키워드를 제공합니다.

This page about typefaces on British motorways uses a meta element to specify some keywords that users might use to look for the page:

<!DOCTYPE HTML>
<html>
 <head>
  <title>Typefaces on UK motorways</title>
  <meta name="keywords" content="british,type face,font,fonts,highway,highways">
 </head>
 <body>
  ...

많은 검색엔진이 이러한 키워드를 가치 있게 고려하지 않습니다. 이 기능은 그동안 별로 믿을만하지 못하게, 때로는 잘못된 방향으로 사용되어서 검색엔진들이 사용자에게 도움이 되지 못하는 결과를 초래했습니다.

Many search engines do not consider such keywords, because this feature has historically been used unreliably and even misleadingly as a way to spam search engine results in a way that is not helpful for users.

To obtain the list of keywords that the author has specified as applicable to the page, the user agent must run the following steps:

  1. Let keywords be an empty list.

  2. For each meta element with a name attribute and a content attribute and whose name attribute's value is keywords, run the following substeps:

    1. Split the value of the element's content attribute on commas.

    2. Add the resulting tokens, if any, to keywords.

  3. Remove any duplicates from keywords.

  4. Return keywords. This is the list of keywords that the author has specified as applicable to the page.

User agents should not use this information when there is insufficient confidence in the reliability of the value.

For instance, it would be reasonable for a content management system to use the keyword information of pages within the system to populate the index of a site-specific search engine, but a large-scale content aggregator that used this information would likely find that certain users would try to game its ranking mechanism through the use of inappropriate keywords.

4.2.5.2 기타 메타데이터 이름

미리 정의된 메타데이터 이름 집합에 대한 확장WHATWG Wiki MetaExtensions 페이지에 등록할 수 있습니다. [WHATWGWIKI]

Extensions to the predefined set of metadata names may be registered in the WHATWG Wiki MetaExtensions page. [WHATWGWIKI]

누구든지 위 페이지를 편집해서 타입을 추가할 수 있습니다. 새로운 이름은 다음과 같은 정보를 포함해야 합니다.

Anyone is free to edit the WHATWG Wiki MetaExtensions page at any time to add a type. These new names must be specified with the following information:

Keyword

정의되어야 할 실제 이름입니다. 이미 정의된 이름과 혼동을 일으킬만큼 비슷해서는 안됩니다.(예를 들어 대소문자로만 다르다거나)

The actual name being defined. The name should not be confusingly similar to any other defined name (e.g. differing only in case).

Brief description

메타데이터 이름의 의미가 무엇인지 나타내는 짧고 규범적이지 않은 설명입니다. 값이 가져야 할 형식을 포함합니다.

A short non-normative description of what the metadata name's meaning is, including the format the value is required to be in.

Specification

메타데이터 이름의 의미와 요구사항에 대한 좀 더 자세히 설명하는 링크입니다. 위키의 다른 페이지일수도 있고 외부 페이지로의 링크여도 됩니다.

A link to a more detailed description of the metadata name's semantics and requirements. It could be another page on the Wiki, or a link to an external page.

Synonyms

정확히 같은 요구사항을 갖는 다른 이름의 목록입니다. 별칭으로 정의된 이름은 사용하지 말아야 합니다. 이러한 이름은 사용자 에이전트가 오래된 내용을 지원하도록 하기 위한 의도만 갖고 있습니다. 실질적으로 더 이상 사용되지 않는 별칭을 삭제해도 됩니다. 오래된 내용과의 호환성을 보장하기 위한 별칭으로 필요한 것들만 이렇게 등록되어야 합니다.

A list of other names that have exactly the same processing requirements. Authors should not use the names defined to be synonyms, they are only intended to allow user agents to support legacy content. Anyone may remove synonyms that are not used in practice; only names that need to be processed as synonyms for compatibility with legacy content are to be registered in this way.

Status

다음 중 하나

One of the following:

Proposed

아직 많은 리뷰와 검증을 거치지 못한 이름입니다. 누군가 이것을 제안했고 이제 막 사용되기 시작했거나 곧 사용되기 시작할 것입니다.

The name has not received wide peer review and approval. Someone has proposed it and is, or soon will be, using it.

Ratified

많은 리뷰와 검증을 거친 이름입니다. 이러한 이름을 사용하는 페이지를 어떻게 다루어야 할 지 모호하지 않은 명세를 가지고 있으며, 잘못 사용되었을 경우에 대한 대응도 포함하고 있습니다.

The name has received wide peer review and approval. It has a specification that unambiguously defines how to handle pages that use the name, including when they use it in incorrect ways.

Discontinued

많은 리뷰를 거쳤고, 부족한 점이 있다고 판단된 이름입니다. 이러한 메타데이터 이름을 사용하는 페이지들이 존재하지만, 새로운 페이지에서는 사용하지 말아야 합니다. 저자들이 대신 사용해야 할 것이 있다면 "간단한 설명"과 "명세" 항목에 그러한 정보를 제공할 것입니다.

The metadata name has received wide peer review and it has been found wanting. Existing pages are using this metadata name, but new pages should avoid it. The "brief description" and "specification" entries will give details of what authors should use instead, if anything.

메타데이터 이름이 이미 존재하는 값으로 채워져 있다면 제거되어야 하며 이미 존재하는 값에 대한 별칭으로 기록해야 합니다.

If a metadata name is found to be redundant with existing values, it should be removed and listed as a synonym for the existing value.

메타데이터 이름이 "제안" 상태에서 1개월이나 이상 사용되거나 명세되지 않고 방치된다면 제거될 것입니다.

If a metadata name is registered in the "proposed" state for a period of a month or more without being used or specified, then it may be removed from the registry.

메타데이터 이름이 "제안" 상태로 추가되었지만 이미 존재하는 값으로 채워져 있다면 제거되어야 하며 이미 존재하는 값에 대한 별칭으로 기록해야 합니다. 메타데이터 이름이 "제안" 상태로 추가되고 위험하다고 판단되면, "중지된" 상태로 바뀌어야 합니다.

If a metadata name is added with the "proposed" status and found to be redundant with existing values, it should be removed and listed as a synonym for the existing value. If a metadata name is added with the "proposed" status and found to be harmful, then it should be changed to "discontinued" status.

누구든 이 상태를 언제든지 바꿀 수 있지만, 위의 정의에 맞게끔 하여야 합니다.

Anyone can change the status at any time, but should only do so in accordance with the definitions above.

Conformance checkers must use the information given on the WHATWG Wiki MetaExtensions page to establish if a value is allowed or not: values defined in this specification or marked as "proposed" or "ratified" must be accepted, whereas values marked as "discontinued" or not listed in either this specification or on the aforementioned page must be rejected as invalid. Conformance checkers may cache this information (e.g. for performance reasons or to avoid the use of unreliable network connectivity).

When an author uses a new metadata name not defined by either this specification or the Wiki page, conformance checkers should offer to add the value to the Wiki, with the details described above, with the "proposed" status.

값이 URL인 메타데이터 이름을 제안하거나 받아들여서는 안됩니다. 링크는 반드시 link 요소를 통해서 나타내야 하며 meta 요소를 통하는 것이 아닙니다.

Metadata names whose values are to be URLs must not be proposed or accepted. Links must be represented using the link element, not the meta element.

4.2.5.3 프라그마 디렉티브

http-equiv 속성이 있는 meta 요소는 프라그마 디렉티브입니다.

When the http-equiv attribute is specified on a meta element, the element is a pragma directive.

http-equiv 속성은 나열 속성입니다. 다음의 표는 이 속성을 위해 정의된 키워드의 목록입니다. 첫번째 열의 상태는 그러한 키워드들이 나타내는 상태입니다.

The http-equiv attribute is an enumerated attribute. The following table lists the keywords defined for this attribute. The states given in the first cell of the rows with keywords give the states to which those keywords map. Some of the keywords are non-conforming, as noted in the last column.

State Keyword Notes
Content Language content-language Non-conforming
Encoding declaration content-type
Default style default-style
Refresh refresh
Cookie setter set-cookie Non-conforming

When a meta element is inserted into the document, if its http-equiv attribute is present and represents one of the above states, then the user agent must run the algorithm appropriate for that state, as described in the following list:

Content language state (http-equiv="content-language")

This feature is non-conforming. Authors are encouraged to use the lang attribute instead.

This pragma sets the pragma-set default language. Until the pragma is successfully processed, there is no pragma-set default language.

  1. If another meta element with an http-equiv attribute in the Content Language state has already been successfully processed (i.e. when it was inserted the user agent processed it and reached the last step of this list of steps), then abort these steps.

  2. If the meta element has no content attribute, or if that attribute's value is the empty string, then abort these steps.

  3. If the element's content attribute contains a U+002C COMMA character (,) then abort these steps.

  4. Let input be the value of the element's content attribute.

  5. Let position point at the first character of input.

  6. Skip whitespace.

  7. Collect a sequence of characters that are not space characters.

  8. Let the pragma-set default language be the string that resulted from the previous step.

This pragma is not exactly equivalent to the HTTP Content-Language header. [HTTP]

Encoding declaration state (http-equiv="content-type")

인코딩 선언 상태charset 속성의 대용일 뿐입니다. 이것은 문자 인코딩 선언입니다.

The Encoding declaration state is just an alternative form of setting the charset attribute: it is a character encoding declaration. This state's user agent requirements are all handled by the parsing section of the specification.

http-equiv 속성이 인코딩 선언 상태meta 요소에서 content 속성의 값은 "text/html;" 와 아스키, 대소문자 구분 없이 일치하는 문자열 → 원하는 만큼의 공백문자 → 리터럴 문자열 "charset=" → 문자 인코딩 선언에 해당하는 이름의 형태여야 합니다. 바꿔 말해 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 같은 형태입니다.

For meta elements with an http-equiv attribute in the Encoding declaration state, the content attribute must have a value that is an ASCII case-insensitive match for a string that consists of: the literal string "text/html;", optionally followed by any number of space characters, followed by the literal string "charset=", followed by the character encoding name of the character encoding declaration.

문서에는 charset 속성이 있는 meta 요소나 http-equiv 속성이 인코딩 선언 상태meta 요소 둘 중 하나만 쓸 수 있습니다.

A document must not contain both a meta element with an http-equiv attribute in the Encoding declaration state and a meta element with the charset attribute present.

HTML 문서에는 인코딩 선언 상태를 사용할 수 있지만, XML 문서에는 인코딩 선언 상태http-equiv 속성이 있는 요소는 사용할 수 없습니다.

The Encoding declaration state may be used in HTML documents, but elements with an http-equiv attribute in that state must not be used in XML documents.

Default style state (http-equiv="default-style")

이 프라그마는 대체 스타일시트 집합의 이름을 설정합니다.

This pragma sets the name of the default alternative style sheet set.

  1. If the meta element has no content attribute, or if that attribute's value is the empty string, then abort these steps.

  2. Set the preferred style sheet set to the value of the element's content attribute. [CSSOM]

Refresh state (http-equiv="refresh")

이 프라그마는 시한 리다이렉트처럼 동작합니다.

This pragma acts as timed redirect.

  1. If another meta element with an http-equiv attribute in the Refresh state has already been successfully processed (i.e. when it was inserted the user agent processed it and reached the last step of this list of steps), then abort these steps.

  2. If the meta element has no content attribute, or if that attribute's value is the empty string, then abort these steps.

  3. Let input be the value of the element's content attribute.

  4. Let position point at the first character of input.

  5. Skip whitespace.

  6. Collect a sequence of characters in the range U+0030 DIGIT ZERO (0) to U+0039 DIGIT NINE (9), and parse the resulting string using the rules for parsing non-negative integers. If the sequence of characters collected is the empty string, then no number will have been parsed; abort these steps. Otherwise, let time be the parsed number.

  7. Collect a sequence of characters in the range U+0030 DIGIT ZERO (0) to U+0039 DIGIT NINE (9) and U+002E FULL STOP (.). Ignore any collected characters.

  8. Skip whitespace.

  9. Let url be the address of the current page.

  10. If the character in input pointed to by position is a U+003B SEMICOLON (";"), then advance position to the next character. Otherwise, jump to the last step.

  11. Skip whitespace.

  12. If the character in input pointed to by position is a U+0055 LATIN CAPITAL LETTER U character (U) or a U+0075 LATIN SMALL LETTER U character (u), then advance position to the next character. Otherwise, jump to the last step.

  13. If the character in input pointed to by position is a U+0052 LATIN CAPITAL LETTER R character (R) or a U+0072 LATIN SMALL LETTER R character (r), then advance position to the next character. Otherwise, jump to the last step.

  14. If the character in input pointed to by position is s U+004C LATIN CAPITAL LETTER L character (L) or a U+006C LATIN SMALL LETTER L character (l), then advance position to the next character. Otherwise, jump to the last step.

  15. Skip whitespace.

  16. If the character in input pointed to by position is a U+003D EQUALS SIGN ("="), then advance position to the next character. Otherwise, jump to the last step.

  17. Skip whitespace.

  18. If the character in input pointed to by position is either a U+0027 APOSTROPHE character (') or U+0022 QUOTATION MARK character ("), then let quote be that character, and advance position to the next character. Otherwise, let quote be the empty string.

  19. Let url be equal to the substring of input from the character at position to the end of the string.

  20. If quote is not the empty string, and there is a character in url equal to quote, then truncate url at that character, so that it and all subsequent characters are removed.

  21. Strip any trailing space characters from the end of url.

  22. Strip any U+0009 CHARACTER TABULATION (tab), U+000A LINE FEED (LF), and U+000D CARRIAGE RETURN (CR) characters from url.

  23. Resolve the url value to an absolute URL, relative to the meta element. If this fails, abort these steps.

  24. Perform one or more of the following steps:

    In addition, the user agent may, as with anything, inform the user of any and all aspects of its operation, including the state of any timers, the destinations of any timed redirects, and so forth.

meta 요소에 리프레시 상태http-equiv 속성이 있으면 해당 요소의 content 속성은 다음 중 한가지로 구성되는 값을 가져야 합니다.

For meta elements with an http-equiv attribute in the Refresh state, the content attribute must have a value consisting either of:

전자의 정수는 페이지가 새로고침 되기까지의 시간을 초 단위로 나타냅니다. 후자의 정수는 페이지가 URL에서 주어진 것으로 교체될 때 까지의 시간을 나타냅니다.

In the former case, the integer represents a number of seconds before the page is to be reloaded; in the latter case the integer represents a number of seconds before the page is to be replaced by the page at the given URL.

뉴스 기관에서 첫 페이지의 head 요소에 다음을 포함시켜서, 페이지가 5분마다 새로고침되도록 하고 있습니다.

A news organization's front page could include the following markup in the page's head element, to ensure that the page automatically reloads from the server every five minutes:

<meta http-equiv="Refresh" content="300">

다음과 같은 마크업으로 개별적인 페이지가 마치 슬라이드쇼처럼 다음 페이지로 리프레시하도록 할 수 있습니다.

A sequence of pages could be used as an automated slide show by making each page refresh to the next page in the sequence, using markup such as the following:

<meta http-equiv="Refresh" content="20; URL=page4.html">
Cookie setter (http-equiv="set-cookie")

이 프라그마는 HTTP 쿠키를 설정합니다. [COOKIES]

This pragma sets an HTTP cookie. [COOKIES]

이것은 올바르지 않습니다. 실제 HTTP 헤더를 사용해야 합니다.

It is non-conforming. Real HTTP headers should be used instead.

  1. If the meta element has no content attribute, or if that attribute's value is the empty string, then abort these steps.

  2. Obtain the storage mutex.

  3. Act as if receiving a set-cookie-string for the document's address via a "non-HTTP" API, consisting of the value of the element's content attribute encoded as UTF-8. [COOKIES] [RFC3629]

위에서 설명한 특정 상태의 meta 요소는 문서당 하나만 존재할 수 있습니다.

There must not be more than one meta element with any particular state in the document at a time.

4.2.5.4 기타 프라그마 디렉티브

조건에 따라, 미리 정의된 프라그마 디렉티브 집합의 확장WHATWG 위키 프라그마익스텐션 페이지에 등록할 수 있습니다. [WHATWGWIKI]

Extensions to the predefined set of pragma directives may, under certain conditions, be registered in the WHATWG Wiki PragmaExtensions page. [WHATWGWIKI]

등록하려는 확장에는 반드시 영구적인 메시지 헤더 필드 레지스트리(Permanent Message Header Field Registry)에 등록된 HTTP 헤더와 동일한 이름을 사용하여야 합니다. [IANAPERMHEADERS]

Such extensions must use a name that is identical to an HTTP header registered in the Permanent Message Header Field Registry, and must have behavior identical to that described for the HTTP header. [IANAPERMHEADERS]

메타데이터를 설명하는 헤더에 대응하는 프라그마 디렉티브, 혹은 사용자 에이전트의 특수한 처리를 필요로 하지 않는 것들은 프라그마 디렉티브가 아니라 메타데이터 이름으로 등록되어야 합니다. HTTP 프로세싱 모델에 영향을 주는(예를 들어, 캐슁) 헤더에 대응하는 프라그마 디렉티브는 등록할 수 없습니다. 그러한 프라그마는 HTTP 레벨의 행동 경향에 있어 HTML 을 구현하는 사용자 에이전트의 그것과, 구현하지 않는 사용자 에이전트의 그것이 달라지는 결과를 초래하기 때문입니다.

Pragma directives corresponding to headers describing metadata, or not requiring specific user agent processing, must not be registered; instead, use metadata names. Pragma directives corresponding to headers that affect the HTTP processing model (e.g. caching) must not be registered, as they would result in HTTP-level behavior being different for user agents that implement HTML than for user agents that do not.

이러한 조건을 만족한다면, 누구든지, 언제든지 WHATWG 위키 프라그마 확장 페이지를 수정할 수 있습니다. 그러한 등록은 다음의 정보를 명시하고 있어야 합니다.

Anyone is free to edit the WHATWG Wiki PragmaExtensions page at any time to add a pragma directive satisfying these conditions. Such registrations must specify the following information:

Keyword

정의되어야 할 이름입니다. 이 이름은 같은 요구사항을 갖는, 이미 등록된 HTTP 이름과 매치되어야 합니다.

The actual name being defined. The name must match a previously-registered HTTP name with the same requirements.

Brief description

프라그마 디렉티브의 목적에 대한 규범적이지 않은 짧은 설명입니다.

A short non-normative description of the purpose of the pragma directive.

Specification

대응하는 HTTP 헤더를 정의하는 명세에 대한 링크입니다.

A link to the specification defining the corresponding HTTP header.

Conformance checkers must use the information given on the WHATWG Wiki PragmaExtensions page to establish if a value is allowed or not: values defined in this specification or listed on the aforementioned page must be accepted, whereas values not listed in either this specification or on the aforementioned page must be rejected as invalid. Conformance checkers may cache this information (e.g. for performance reasons or to avoid the use of unreliable network connectivity).

4.2.5.5 문서의 문자 인코딩 명시

문자 인코딩 선언은 문서를 저장하거나 전송할 때 사용할 문자 인코딩 메커니즘입니다.

A character encoding declaration is a mechanism by which the character encoding used to store or transmit a document is specified.

문자 인코딩 선언에는 다음 제한이 적용됩니다.

The following restrictions apply to character encoding declarations:

meta 요소의 제한 때문에 meta 요소를 통한 문자 인코딩 선언은 문서당 한 번만 가능합니다.

In addition, due to a number of restrictions on meta elements, there can only be one meta-based character encoding declaration per document.

문서가 BOMByte-Order-Mark으로 시작하지 않고, 문서의 인코딩이 Content-Type 메타데이터를 통해 명시적으로 지정되지 않았으며, iframe srcdoc문서 역시 아니라면, 그러한 문서의 인코딩은 아스키 호환 문자 인코딩이어야 합니다. 그러한 인코딩이 US-아스키가 아니라면, 반드시 charset 속성 또는 인코딩 선언 상태http-equiv 속성을 갖는 meta 요소를 통해 명시하여야 합니다.

If an HTML document does not start with a BOM, and if its encoding is not explicitly given by Content-Type metadata, and the document is not an iframe srcdoc document, then the character encoding used must be an ASCII-compatible character encoding, and, in addition, if that encoding isn't US-ASCII itself, then the encoding must be specified using a meta element with a charset attribute or a meta element with an http-equiv attribute in the Encoding declaration state.

iframe srcdoc 문서에는 문자 인코딩 선언을 써서는 안됩니다. iframe을 포함하는 문서의 일부분으로 이미 디코드되었기 때문입니다.

If the document is an iframe srcdoc document, the document must not have a character encoding declaration. (In this case, the source is already decoded, since it is part of the document that contained the iframe.)

HTML 문서charset, 혹은 인코딩 선언 상태http-equiv 속성을 갖는 meta 요소를 포함한다면, 그러한 인코딩은 아스키 호환 문자 인코딩이어야 합니다.

If an HTML document contains a meta element with a charset attribute or a meta element with an http-equiv attribute in the Encoding declaration state, then the character encoding used must be an ASCII-compatible character encoding.

UTF-8을 권장합니다. 준수사항 검사기는 구형 인코딩을 발견하였을 때 저자에게 권고할 수 있습니다. [RFC3629]

Authors are encouraged to use UTF-8. Conformance checkers may advise authors against using legacy encodings. [RFC3629]

Authoring tools should default to using UTF-8 for newly-created documents. [RFC3629]

0x20 - 0x7E 영역의 바이트가 이에 대응하는 U+0020 - U+007E 이외의 다른 문자로 인코드되는 인코딩은 보안상 취약합니다. 이러한 인코딩을 지원하지 않는(혹은, 그러한 인코딩을 선언하기 위해 사용된 레이블을 지원하지 않는, 또는 레이블 없는 컨텐츠의 인코딩을 다른 사용자 에이전트로서 감지하는 메커니즘을 사용하지 않는) 사용자 에이전트는 기술적으로 양성인역주 평범한 텍스트를 HTML, 자바스크립트로 간주할 가능성이 있습니다. 예를 들어 아스키 표현에서 "<script>"에 해당하는 바이트를 다른 문자열로 바꿔버리는 인코딩이 이에 해당합니다. 이러한 인코딩을 사용해서는 안됩니다. 이에 해당하는 인코딩으로 알려진 것들은 다음과 같습니다: JIS_C6226-1983, JIS_X0212-1990, HZ-GB-2312, JOHAB(윈도우즈 코드페이지 1361), ISO-2022에 기반한 인코딩들, EBCDIC에 기반한 인코딩들. 이에 더해, CESU-8, UTF-7, BOCU-1, SCSU 같은 인코딩들도 사용하지 말아야 합니다. 이러한 인코딩들은 웹 컨텐츠를 위해 의도된 적이 없기 때문입니다. [RFC1345] [RFC1842] [RFC1468] [RFC2237] [RFC1554] [RFC1922] [RFC1557] [CESU8] [UTF7] [BOCU1] [SCSU]

Encodings in which a series of bytes in the range 0x20 to 0x7E can encode characters other than the corresponding characters in the range U+0020 to U+007E represent a potential security vulnerability: a user agent that does not support the encoding (or does not support the label used to declare the encoding, or does not use the same mechanism to detect the encoding of unlabelled content as another user agent) might end up interpreting technically benign plain text content as HTML tags and JavaScript. For example, this applies to encodings in which the bytes corresponding to "<script>" in ASCII can encode a different string. Authors should not use such encodings, which are known to include JIS_C6226-1983, JIS_X0212-1990, HZ-GB-2312, JOHAB (Windows code page 1361), encodings based on ISO-2022, and encodings based on EBCDIC. Furthermore, authors must not use the CESU-8, UTF-7, BOCU-1 and SCSU encodings, which also fall into this category, because these encodings were never intended for use for Web content. [RFC1345] [RFC1842] [RFC1468] [RFC2237] [RFC1554] [RFC1922] [RFC1557] [CESU8] [UTF7] [BOCU1] [SCSU]

UTF-32는 사용하지 말아야 합니다. 명세에서 설명한 인코딩 감지 알고리즘은 UTF-32를 UTF-16과 의도적으로 구분하지 않습니다. [UNICODE]

Authors should not use UTF-32, as the encoding detection algorithms described in this specification intentionally do not distinguish it from UTF-16. [UNICODE]

UTF-8 이외의 인코딩 방법을 사용한다면, 폼을 제출하거나 URL 인코딩 값을 보낼 때 예상치 못한 결과가 발생할 수 있습니다. 그러한 절차는 문서의 인코딩을 기본값으로 사용하기 때문입니다.

Using non-UTF-8 encodings can have unexpected results on form submission and URL encodings, which use the document's character encoding by default.

XHTML에서 필요하다면 XML 선언은 인라인 문자 인코딩 정보로 사용해야 합니다.

In XHTML, the XML declaration should be used for inline character encoding information, if necessary.

HTML에서 문자 인코딩이 UTF-8 임을 선언하려면 다음의 마크업을 문서의 처음 부근(head 요소 안에)에 넣을 수 있습니다.

In HTML, to declare that the character encoding is UTF-8, the author could include the following markup near the top of the document (in the head element):

<meta charset="utf-8">

XML에서는 마크업 최상단에 다음 XML 선언을 대신 사용합니다.

In XML, the XML declaration would be used instead, at the very top of the markup:

<?xml version="1.0" encoding="utf-8"?>

4.2.6 style 요소

요소가 속하는 범주Categories

메타데이터.Metadata content.

scoped 속성이 없을 때: 플로우 컨텐츠

If the scoped attribute is present: flow content.

이 요소가 사용될 수 있는 문맥Contexts in which this element can be used

scoped 속성이 없을 때: 메타데이터가 있을 수 있는 곳

If the scoped attribute is absent: where metadata content is expected.

head 요소의 자식 요소인 noscript 요소 내부

If the scoped attribute is absent: in a noscript element that is a child of a head element.

scoped 속성이 있을 때 : 플로우 컨텐츠가 나타날 수 있는 곳. 하지만 이 요소의 앞에는 style 요소와 요소간 공백 이외의 다른 플로우 컨텐츠는 허용되지 않습니다.

If the scoped attribute is present: where flow content is expected, but before any other flow content other than other style elements and inter-element whitespace.

이 요소가 포함할 수 있는 것Content model

type 속성의 값에 따라 다릅니다. 하지만 아래에서 설명하는 요구사항을 준수하여야 합니다.

Depends on the value of the type attribute, but must match requirements described in prose below.

요소에 쓸 수 있는 속성Content attributes

전역 속성Global attributes

media
type
scoped
Also, the title attribute has special semantics on this element.
DOM 인터페이스DOM interface
interface HTMLStyleElement : HTMLElement {
           attribute boolean disabled;
           attribute DOMString media;
           attribute DOMString type;
           attribute boolean scoped;
};
HTMLStyleElement implements LinkStyle;

style 요소를 사용해서 스타일 정보를 문서에 포함시킬 수 있습니다. style 요소는 스타일 프로세싱 모델에 포함되는 몇가지 입력 중 하나입니다. 요소는 사용자에게 아무것도 나타내지 않습니다.

The style element allows authors to embed style information in their documents. The style element is one of several inputs to the styling processing model. The element does not represent content for the user.

type 속성은 스타일 언어를 나타냅니다. 속성이 있다면, 그 값은 스타일 언어를 지칭하는 유효한 마임 타입이어야 합니다. charset 매개변수는 사용할 수 없습니다. 속성이 존재하지 않는다면, 기본값으로 "text/css"를 사용합니다. [RFC2318]

The type attribute gives the styling language. If the attribute is present, its value must be a valid MIME type that designates a styling language. The charset parameter must not be specified. The default value for the type attribute, which is used if the attribute is absent, is "text/css". [RFC2318]

When examining types to determine if they support the language, user agents must not ignore unknown MIME parameters — types with unknown parameters must be assumed to be unsupported. The charset parameter must be treated as an unknown parameter for the purpose of comparing MIME types here.

media 속성은 스타일이 적용될 매체를 나타냅니다. 값은 유효한 미디어 쿼리여야 합니다.

The media attribute says which media the styles apply to. The value must be a valid media query. The user agent must apply the styles when the media attribute's value matches the environment and the other relevant conditions apply, and must not apply them otherwise.

The styles might be further limited in scope, e.g. in CSS with the use of @media blocks. This specification does not override such further restrictions or requirements.

media 속성이 생략되었다면 그 기본값은 "all" 이며, 모든 매체에 이 스타일이 적용됨을 의미합니다.

The default, if the media attribute is omitted, is "all", meaning that by default styles apply to all media.

scoped 속성은 불리언 속성입니다. 설정되었다면, 요소는 Document 전체가 아니라 자신의 부모 요소에서 뻗어나온 서브트리에만 적용됨을 의미합니다.

The scoped attribute is a boolean attribute. If set, it indicates that the styles are intended just for the subtree rooted at the style element's parent element, as opposed to the whole Document.

If the scoped attribute is present, then the user agent must apply the specified style information only to the style element's parent element (if any), and that element's child nodes. Otherwise, the specified styles must, if applied, be applied to the entire document.

For scoped CSS resources, the effect of @-rules must be scoped to the scoped sheet and its subresources, even if the @-rule in question would ordinarily apply to all style sheets that affect the Document. Any '@page' rules in scoped CSS resources must be ignored.

For example, an '@font-face' rule defined in a scoped style sheet would only define the font for the purposes of font rules in the scoped section; style sheets outside the scoped section using the same font name would not end up using that embedded font.

title 속성은 대체 스타일시트 집합을 정의합니다. style 요소가 title 속성을 갖지 않는다면, 요소는 그러한 속성이 없는 것입니다 : 부모 요소의 title 속성은 style 요소에 적용되지 않습니다. [CSSOM]

The title attribute on style elements defines alternative style sheet sets. If the style element has no title attribute, then it has no title; the title attribute of ancestors does not apply to the style element. [CSSOM]

style 요소의 title 속성은, link 요소에서의 그것과 마찬가지로, 부모 요소의 것을 상속받지 않습니다: 그것은 단순히 title이 없는 것입니다.

The title attribute on style elements, like the title attribute on link elements, differs from the global title attribute in that a style block without a title does not inherit the title of the parent element: it merely has no title.

style 요소의 textContent는 다음의 ABNF, 유니코드를 위한 문자셋의 style 결과물과 일치해야 합니다. [ABNF]

The textContent of a style element must match the style production in the following ABNF, the character set for which is Unicode. [ABNF]

style         = no-c-start *( c-start no-c-end c-end no-c-start )
no-c-start    = <any string that doesn't contain a substring that matches c-start >
c-start       = "<!--"
no-c-end      = <any string that doesn't contain a substring that matches c-end >
c-end         = "-->"

All descendant elements must be processed, according to their semantics, before the style element itself is evaluated. For styling languages that consist of pure text (as opposed to XML), user agents must evaluate style elements by passing the concatenation of the contents of all the text nodes that are direct children of the style element (not any other nodes such as comments or elements), in tree order, to the style system. For XML-based styling languages, user agents must pass all the child nodes of the style element to the style system.

All URLs found by the styling language's processor must be resolved, relative to the element (or as defined by the styling language), when the processor is invoked.

Once the attempts to obtain the style sheet's critical subresources, if any, are complete, or, if the style sheet has no critical subresources, once the style sheet has been parsed and processed, the user agent must, if the loads were successful or there were none, queue a task to fire a simple event named load at the style element, or, if one of the style sheet's critical subresources failed to completely load for any reason (e.g. DNS error, HTTP 404 response, a connection being prematurely closed, unsupported Content-Type), queue a task to fire a simple event named error at the style element. Non-network errors in processing the style sheet or its subresources (e.g. CSS parse errors, PNG decoding errors) are not failures for the purposes of this paragraph.

The task source for these tasks is the DOM manipulation task source.

The element must delay the load event of the element's document until all the attempts to obtain the style sheet's critical subresources, if any, are complete.

이 명세는 스타일 시스템을 명시하지 않습니다만, 거의 모든 웹 브라우저들이 지원하는 CSS를 간주하고 있습니다. [CSS]

This specification does not specify a style system, but CSS is expected to be supported by most Web browsers. [CSS]

The media, type and scoped IDL attributes must reflect the respective content attributes of the same name.

IDL 속성 disabled대체 스타일시트 DOM에서 정의된 것과 마찬가지로 행동합니다.

The disabled IDL attribute behaves as defined for the alternative style sheets DOM.

LinkStyle 인터페이스 역시 이 요소에 의해 구현됩니다. 스타일 프로세싱 모델이 방법을 정의합니다. [CSSOM]

The LinkStyle interface is also implemented by this element; the styling processing model defines how. [CSSOM]

다음 문서는 강조 스타일을 이탤릭체가 아닌 밝은 적색으로 표시하고, 책 제목과 라틴어는 기본값인 이탤릭체로 표시했습니다. 적합한 요소를 사용하면 문서의 스타일을 얼마나 쉽게 재정비할 수 있는지 보여주는 예제입니다.

The following document has its emphasis styled as bright red text rather than italics text, while leaving titles of works and Latin words in their default italics. It shows how using appropriate elements enables easier restyling of documents.

<!DOCTYPE html>
<html lang="en-US">
 <head>
  <title>My favorite book</title>
  <style>
   body { color: black; background: white; }
   em { font-style: normal; color: red; }
  </style>
 </head>
 <body>
  <p>My <em>favorite</em> book of all time has <em>got</em> to be
  <cite>A Cat's Life</cite>. It is a book by P. Rahmel that talks
  about the <i lang="la">Felis Catus</i> in modern human society.</p>
 </body>
</html>

4.2.7 스타일링

link 요소와 style 요소는 사용자 에이전트가 문서를 렌더링할때 사용할 스타일 정보를 제공합니다. DOM 스타일 명세는 사용자 에이전트가 어떠한 스타일 정보를 사용하는지, 어떻게 사용하는지 명시하고 있습니다. [CSSOM]

The link and style elements can provide styling information for the user agent to use when rendering the document. The DOM Styling specification specifies what styling information is to be used by the user agent and how it is to be used. [CSSOM]

style 요소와 link 요소는 LinkStyle 인터페이스를 구현합니다. [CSSOM]

The style and link elements implement the LinkStyle interface. [CSSOM]

For style elements, if the user agent does not support the specified styling language, then the sheet attribute of the element's LinkStyle interface must return null. Similarly, link elements that do not represent external resource links that contribute to the styling processing model (i.e. that do not have a stylesheet keyword in their rel attribute), and link elements whose specified resource has not yet been fetched, or is not in a supported styling language, must have their LinkStyle interface's sheet attribute return null.

Otherwise, the LinkStyle interface's sheet attribute must return a StyleSheet object with the following properties: [CSSOM]

The style sheet type

The style sheet type must be the same as the style's specified type. For style elements, this is the same as the type content attribute's value, or text/css if that is omitted. For link elements, this is the Content-Type metadata of the specified resource.

The style sheet location

For link elements, the location must be the result of resolving the URL given by the element's href content attribute, relative to the element, or the empty string if that fails. For style elements, there is no location.

The style sheet media

The media must be the same as the value of the element's media content attribute, or the empty string, if the attribute is omitted.

The style sheet title

The title must be the same as the value of the element's title content attribute, if the attribute is present and has a non-empty value. If the attribute is absent or its value is the empty string, then the style sheet does not have a title (it is the empty string). The title is used for defining alternative style sheet sets.

The style sheet alternate flag

For link elements, true if the link is an alternative stylesheet. In all other cases, false.

The same object must be returned each time.

The disabled IDL attribute on link and style elements must return false and do nothing on setting, if the sheet attribute of their LinkStyle interface is null. Otherwise, it must return the value of the StyleSheet interface's disabled attribute on getting, and forward the new value to that same attribute on setting.

The rules for handling alternative style sheets are defined in the CSS object model specification. [CSSOM]


Style sheets, whether added by a link element, a style element, an <?xml-stylesheet> PI, an HTTP Link: header, or some other mechanism, have a style sheet ready flag, which is initially unset.

When a style sheet is ready to be applied, its style sheet ready flag must be set. If the style sheet referenced no other resources (e.g. it was an internal style sheet given by a style element with no @import rules), then the style rules must be synchronously made available to script; otherwise, the style rules must only be made available to script once the event loop reaches its "update the rendering" step.

A style sheet in the context of the Document of an HTML parser or XML parser is said to be a style sheet that is blocking scripts if the element was created by that Document's parser, and the element is either a style element or a link element that was an external resource link that contributes to the styling processing model when the element was created by the parser, and the element's style sheet was enabled when the element was created by the parser, and the element's style sheet ready flag is not yet set, and, the last time the event loop reached step 1, the element was in that Document, and the user agent hasn't given up on that particular style sheet yet. A user agent may give up on a style sheet at any time.

A Document has a style sheet that is blocking scripts if there is either a style sheet that is blocking scripts in the context of that Document, or if that Document is in a browsing context that has a parent browsing context, and the active document of that parent browsing context itself has a style sheet that is blocking scripts.

A Document has no style sheet that is blocking scripts if it does not have a style sheet that is blocking scripts as defined in the previous paragraph.

두번째 예제에서 사용된 타이틀은 "벌이 교미기간에 추는 춤" 입니다. 돌아가기

pragma directive(프라그마 디렉티브): pragma - precomplier. 선처리기. directive - 지시자. 두 단어의 뜻으로 볼 때 문서의 파싱을 시작하기 전에 컴파일 힌트를 제공한다는 의미로 생각됩니다. 돌아가기

benign:악성의 반대말. 위험하지 않은 돌아가기