CSS实现噪点文字效果实例页面
回到相关文章 »效果:
CSS新世界
代码:
CSS代码:
.title {
height: 300px;
display: grid;
place-items: center;
background-color: deepskyblue;
}
.title strong {
font-size: 100px;
color: #0000;
background:
repeating-radial-gradient(#000 0 0.0001%,#fff 0 0.0002%) 50% 0/2500px 2500px,
repeating-conic-gradient(#000 0 0.0001%,#fff 0 0.0002%) 50% 50%/2500px 2500px;
background-blend-mode: difference;
mix-blend-mode: lighten;
-webkit-background-clip: text;
background-clip: text;
}
HTML代码:
<div class="title">
<strong>CSS新世界</strong>
</div>