Properties

Properties

Editing
  • account_tree
  • bug_report

container-type

컨테이너 크기 쿼리(container size queries)와 같이 명시적 포함이 필요한 컨테이너 쿼리(container queries) 목적의 쿼리 컨테이너로 요소를 설정하여 하위 스타일 규칙이 크기(size) 및 레이아웃(layout)의 다양한 측면을 쿼리하고 그에 따라 응답할 수 있도록 한다.

사용 가능한 값 타입

<'container-type'>

DEVDIC-Specified Data Types

container-type 속성에 사용되는 타입이다.

  • CSS Containment Module Level 3
    normal || [ size | inline-size ]

사용되는 키워드

  • inline-size

    CSS Containment Module Level 3

    컨테이너 자체의 인라인 축에서 컨테이너 크기 쿼리에 대한 쿼리 컨테이너(query container)을 설정한다. 기본 박스(principal box)에 레이아웃 포함(layout containment), 스타일 포함(style containment), 인라인 크기 포함(inline-size containment)을 적용한다.

  • normal

    CSS Containment Module Level 3

    컨테이너 크기 쿼리에 대한 쿼리 컨테이너(query container)가 아니지만 컨테이너 스타일 쿼리(container style queries)에 대한 쿼리 컨테이너(query container)로 남아 있다.

  • size

    CSS Containment Module Level 3

    인라인 축과 블록 축 모두에서 컨테이너 크기 쿼리를 위한 쿼리 컨테이너(query container)를 설정한다. 기본 박스(principal box)에 레이아웃 포함(layout containment), 스타일 포함(style containment), 크기 포함(size containment)을 적용한다.

다음은 필요에 따라 일부 값을 설명하므로 표시되지 않는 값은 값 유형을 참조하라.

  • 〈'container-type'〉normal
    CSS Containment Module Level 3

    컨테이너 크기 쿼리에 대한 쿼리 컨테이너(query container)가 아니지만 컨테이너 스타일 쿼리(container style queries)에 대한 쿼리 컨테이너(query container)로 남아 있다.

구문

  • container-type: inline-size;
    CSS Containment Module Level 3
    Example

버전 명세

Modules
Module NameStatusSummary
CSS Containment Module Level 3

Last review date: 2023-3-30

지원 웹브라우저