[笔记]CSS实现近视文字

上次记录了如何用CSS实现文字黑幕，这次来用CSS实现近视文字，让人以为自己看不清了。

演示

效果展示

1	<p><span class="blurmask" title="嘿嘿嘿">效果展示</span></p>

.blurmask {
  position: relative;
  filter: blur(5px); /* 初始模糊效果，可以根据需要调整模糊程度 */
  transition: filter 0.5s; /* 过渡效果的时间 */
}

.blurmask:hover {
  filter: blur(0); /* 鼠标悬停时取消模糊效果 */
}

.blurmask:hover:before {
  opacity: 0;
}

本文采用署名-非商业性使用-相同方式共享 4.0 国际许可协议，转载请注明出处。