css 滤镜效果主要对HTML标记设置滤镜效果

CSS滤镜是一种CSS属性，它允许你在内容上覆盖一层透明的、可用的效果。 这些效果通常用于图像，但还可以应用于其他元素。

准备

首先，我们需要在HTML中准备一些元素，然后在CSS中添加滤镜。

<div class="container">
  <img src="example.jpg" alt="example"/>
  <p>这是一个段落</p>
</div>

实现

要对这些元素添加效果，我们可以使用CSS filter属性。下面是两个示例，演示如何添加模糊和变亮的效果：

模糊效果

.container img {
  filter: blur(5px);
}

上述代码将在图片上应用一个5px的模糊效果。

变亮效果

.container p {
  filter: brightness(200%);
}

上述代码将在段落文字上应用200%的变亮效果。

结论

滤镜效果可以应用于网站上的不同元素，包括图片和文本。通过使用不同的滤镜效果，可以为网站添加特殊的视觉效果，从而提高用户体验。