<div class="moare">
<img src="https://picx.zhimg.com/v2-3b4fc7e3a1195a081d0259246c38debc_720w.jpg?source=172ae18b" alt="" />
</div>
.moare {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
filter: contrast(2000%);
overflow: hidden;
}
.moare::before {
content: "";
position: absolute;
top: -50%;
left: -50%;
bottom: -50%;
right: -50%;
background: radial-gradient(circle at center, #333, #fff);
background-size: 0.25em 0.25em;
transform: rotate(20deg);
}
.moare img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
mix-blend-mode: hard-light;
filter: grayscale(1) brightness(80%) contrast(150%) blur(2px);
}
效果:
=======》