Thuộc tính mask-size CSS

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

mask-size Thuộc tính này xác định kích thước của hình ảnh che khuất.

Đặt kích thước của hình ảnh che khuất (bằng phần trăm):

.mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 70%;
  mask-repeat: no-repeat;
}

Đặt kích thước của hình ảnh che khuất (bằng pixel):

.mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 200px 200px;
  mask-repeat: no-repeat;
}

mask-size: auto|size|contain|cover|initial|inherit;

Giá trị	Mô tả
auto	Giá trị mặc định.
size	Định nghĩa kích thước của hình ảnh che khuất, có thể sử dụng các đơn vị như px, em, hoặc sử dụng %.
contain	Phóng to hình ảnh che khuất để đảm bảo rằng độ rộng và độ cao của nó có thể thích ứng với không gian bên trong khối chứa.
cover	Phóng to hình ảnh che khuất để đảm bảo rằng độ rộng và độ cao của nó có thể che盖住 khối chứa.
initial	Đặt thuộc tính này thành giá trị mặc định. Xem thêm initial.
inherit	Ghi nhận thuộc tính này từ phần tử cha của nó. Xem thêm inherit.

Giá trị mặc định:	auto
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 1 của CSS Masking
Ngữ pháp JavaScript:	object.style.maskSize="100px 200px"