如何创建圆形半透明蒙版

<div class="mask-container">
  <!-- 内容 -->
</div>

.mask-container {
  position: relative;
  opacity: 0.5;
}

<div class="mask-container">
  <div class="circle-mask"></div>
  <!-- 内容 -->
</div>

.circle-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: black;
}

.mask-container {
  position: relative;
  opacity: 0.5;
}

.circle-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.5); /* 使用rgba设置半透明背景 */
}

<div class="mask-container">
  <div class="circle-mask"></div>
  <!-- 需要应用蒙版的内容 -->
  <img src="image.jpg" alt="Image">
  <p>Some text</p>
</div>