CSS Rules

Editing

@namespace

임스페이스(namespace) 접두사를 선언하고 이를 지정된 네임스페이스(namespace) 이름(문자열)과 연결한다. CSS 스타일시트에서 사용할 XML 네임스페이스(namespace)를 정의한다.

설명

@namespace 규칙은 모든 @charset@import 규칙을 따라야 하며 스타일시트에서 무시되지 않는 다른 모든 앳룰(at-rules) 및 스타일 규칙(style rules) 앞에 와야 한다.

잘못된 @namespace 규칙이 포함된 CSS 스타일시트는 유효하지 않다.

URI 구문에서 구문 분석된 URI 문자열은 리터럴(literal) 문자열로 취급되며 STRING 구문과 마찬가지로 URI 관련 정규화가 적용되지 않는다.

빈 문자열 및 유효하지 않은 URI를 나타내는 문자열을 포함한 모든 문자열은 @namespace 선언에서 유효한 네임스페이스(namespace)이다.

네임스페이스(namespace)는 선택자를 제한하는 데 사용할 수 있다. 일반적으로 여러 네임스페이스(namespace)가 포함된 문서를 다룰 때 유용하다.

네임스페이스의 사용과 적용
<p>
    <a href="#">This is an ordinary HTML link.</a>
</p>

<svg width="250" viewBox="0 0 250 20" xmlns="http://www.w3.org/2000/svg">
    <a href="#">
        <text x="0" y="12">
            This is link in SVG way.
        </text>
    </a>
</svg>
 
@namespace svg url('http://www.w3.org/2000/svg');

a {
    font-weight: bold;
}

/* Only svg namespace */
svg|a {
    font-weight: normal !important;
}

선언

<@namespace>

DEVDIC-Specified Data Types

@namespace 앳룰(at-rules)의 구문 형식을 나타낸다.

  • CSS Namespace Module Level 3
    @namespace <namespace-prefix>? [ <string> (en-US) | <url> ]

포함된 타입

아래 유형에서 지원하는 모든 키워드와 단위를 사용하지 않을 수도 있다.

  • <namespace-prefix>

    네임스페이스(namespace)의 접두어를 나타낸다.

    • CSS Namespace Module Level 3
      <ident> (en-US)
    Details

    포함된 타입

    • <ident>

      식별자로 사용되는 임의의 문자열을 나타낸다.

  • <string>

    따옴표로 감싸진 데이터 유형을 표현한다.

    • "this is a 'string'."
    Details

    동일한 타입을 사용하는 관련 속성

    모든 속성을 표시하지 않을 수도 있다.

    • font-family

      글꼴을 지정한다.

    • content

      가상 요소로 생성할 콘텐츠를 설정한다.

    • quotes

      인용 부호의 유형을 설정한다.

  • <url>

    이미지나 글꼴 등 리소스를 가리키는 문자열을 나타낸다.

    • CSS Values and Units Module Level 4
      <url()> | <src()>
    Details

    포함된 타입

    • <src()>

      src() 함수의 매개변수를 나타낸다.

      • CSS Values and Units Module Level 4
        src( <string> <url-modifier>* )
      Details

      포함된 타입

      • <string>

        따옴표로 감싸진 데이터 유형을 표현한다.

        • "this is a 'string'."
        Details 기능이 없다면 사용되는 타입이 동일한 타입을 사용하는 다른 항목에서 설명하거나 없는 경우이다.
        타입에 대한 자세한 설명은 다음 링크를 참조하라.[<string>]
      • <url-modifier>

        URL의 의미나 해석을 어떻게든 변경하는 타입이다.

    • <url()>

      url() 함수의 매개변수를 나타낸다.

      • CSS Values and Units Module Level 4
        url( <string> <url-modifier>*| <url-token>
      Details

      포함된 타입

      • <url-token>

        URL Token Railroad Diagrams

        <ident-token "url"> ( ws* not " ' ( ) \ ws or non-printable escape ws* )
      • <string>

        따옴표로 감싸진 데이터 유형을 표현한다.

        • "this is a 'string'."
        Details

        동일한 타입을 사용하는 관련 속성

        모든 속성을 표시하지 않을 수도 있다.

        • font-family

          글꼴을 지정한다.

        • content

          가상 요소로 생성할 콘텐츠를 설정한다.

        • quotes

          인용 부호의 유형을 설정한다.

      • <url-modifier>

        URL의 의미나 해석을 어떻게든 변경하는 타입이다.

        Details 기능이 없다면 사용되는 타입이 동일한 타입을 사용하는 다른 항목에서 설명하거나 없는 경우이다.
        타입에 대한 자세한 설명은 다음 링크를 참조하라.[<url-modifier>]

    관련 함수

    모든 함수를 표시하지 않을 수도 있다.

    동일한 타입을 사용하는 관련 속성

    모든 속성을 표시하지 않을 수도 있다.

    • background-image

      선택자를 갖는 요소에 배경 이미지를 설정한다.

    • clip-path

      요소의 클리핑 범위를 설정한다.

예제

Example

버전 명세

Modules
Module NameStatusSummary
CSS Namespace Module Level 3권장

Last review date: 2023-4-13

지원 웹브라우저