CodePen Embed - rNYjVzM

<h3>Sử dụng gradient như một lớp mặt nạ:</h3>
<div class="mask1">
<img src="https://laptrinhtudau.com/wp-content/uploads/2022/01/img_5terre.jpg" alt="Cinque Terre" width="600" height="400">
</div>

<h3>Ảnh gốc:</h3>
<img src="https://laptrinhtudau.com/wp-content/uploads/2022/01/img_5terre.jpg" alt="Cinque Terre" width="600" height="400">

.mask1 {
  -webkit-mask-image: linear-gradient(black, transparent);
  mask-image: linear-gradient(black, transparent);
}

This Pen is owned by sonsonct on CodePen.

See more by @sonsonctnp on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.