如何在css中设置蒙版图像的宽度和高度？

/* 设置固定宽度和高度 */
.mask {
  background-image: url('path/to/your/mask-image.png');
  background-size: 200px 100px; /* 宽度为200px，高度为100px */
}

/* 使用百分比 */
.mask {
  background-image: url('path/to/your/mask-image.png');
  background-size: 50% 50%; /* 宽度和高度都为父元素的50% */
}

/* 使用关键字 */
.mask {
  background-image: url('path/to/your/mask-image.png');
  background-size: cover; /* 覆盖整个元素，可能会裁剪图像 */
}

<div class="mask">
  <img src="path/to/your/mask-image.png" alt="Mask Image">
</div>

.mask img {
  width: 200px; /* 设置固定宽度 */
  height: 100px; /* 设置固定高度 */
  object-fit: cover; /* 覆盖整个容器，可能会裁剪图像 */
}

.mask {
  background-image: url('path/to/your/mask-image.png');
  width: 200px;
  height: 100px;
  clip-path: inset(0 0 0 0); /* 初始状态，不裁剪 */
}