Thuộc tính mask-type CSS

Trang trước mask-size
Trang tiếp theo max-block-size

Định nghĩa và cách sử dụng

mask-type Thuộc tính xác định phần tử <mask> SVG được xử lý như là một ảnh che phủ độ sáng hay như là một ảnh che phủ alpha.

Thuộc tính này áp dụng cho phần tử <mask> SVG chính nó.

Mô hình

Xem hai phần tử <mask> SVG; một cái sử dụng mask-type: alphavà một cái khác sử dụng mask-type: luminance:

<svg width="200" height="120" xmlns="http://www.w3.org/2000/svg">
  </defs>
    <mask id="mask1" maskContentUnits="objectBoundingBox" style="mask-type:alpha">
      <rect width="10" height="10" fill="red" fill-opacity="0.7" />
    </mask>
    <mask id="mask2" maskContentUnits="objectBoundingBox" style="mask-type:luminance">
      <rect width="10" height="10" fill="red" fill-opacity="0.7" />
    </mask>
  </defs>
</svg>

Thử ngay

Ngữ pháp CSS

mask-type: luminance|alpha|initial|inherit;

Giá trị thuộc tính

Giá trị	Mô tả
luminance	Xem ảnh che phủ như là một ảnh che phủ độ sáng. Giá trị mặc định.
alpha	Xem ảnh che phủ như là một ảnh che phủ alpha.
initial	Đặt thuộc tính này về giá trị mặc định. Xem thêm initial.
inherit	Thừa kế thuộc tính này từ phần tử cha. Xem thêm inherit.

Chi tiết kỹ thuật

Giá trị mặc định:	luminance
Kế thừa:	Không
Chế tạo animation:	Không hỗ trợ. Xem thêm:Thuộc tính liên quan đến animation.
Phiên bản:	Module Masking CSS Level 1
Ngữ pháp JavaScript:	object.style.maskType="alpha"