Properties

Properties

Editing
  • account_tree
  • bug_report

mask-border-slice

mask-border-source 속성에 의해 설정된 이미지를 영역으로 나눈다. 이 영역은 요소의 마스크 테두리 구성 요소를 형성하는데 사용된다.

설명

현재 대부분의 웹브라우저가 mask-border-*는 벤더프리픽스 타입의  -webkit-mask-box-image-* 속성으로 처리된다. 자세한 사항은 지원 웹브라우저 현황을 참고하기 바란다.

사용 가능한 값 타입

<'mask-border-slice'>

DEVDIC-Specified Data Types

mask-border-slice 속성에 사용되는 타입이다.

  • CSS Masking Module Level 1
    <number-percentage>{1,4} fill?

    마스크 테두리 이미지의 위쪽, 오른쪽, 아래쪽 및 왼쪽 가장자리에서 내부 오프셋을 지정하여 4개의 모서리, 4개의 가장자리 및 중앙의 9개 영역으로 나눈다. fill 키워드가 없는 한 중간 이미지 부분은 폐기되고 완전히 불투명한 흰색으로 처리한다.

포함된 타입

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

사용되는 키워드

  • fill

    CSS Masking Module Level 1

    중간 이미지 영역을 유지한다. 너비와 높이는 각각 위쪽 및 왼쪽 이미지 영역과 일치하도록 크기가 조정된다.

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

  • CSS Masking Module Level 1
    Example
  • CSS Masking Module Level 1

    중간 이미지 영역을 유지한다. 너비와 높이는 각각 위쪽 및 왼쪽 이미지 영역과 일치하도록 크기가 조정된다.

    Example

구문

  • mask-border-slice: 100;
    CSS Masking Module Level 1
  • mask-border-slice: 5 2 10 20 fill;
    CSS Masking Module Level 1
    Example

버전 명세

Modules
Module NameStatusSummary
CSS Masking Module Level 1후보 추천 초안

Last review date: 2023-1-14

지원 웹브라우저