1.网站变灰
filter: grayscale(1);

1-1.brightness() 调整图像,使其看起来更亮或更暗
1-2. contrast()调整输入图像的对比度
1-3.blur()高斯模糊
1-4.drop-shadow()投影

给黄色和红色进行blur(5px),即屏幕上有5px像素相互融合

2.子元素内容与父系元素内容颜色混合
mix-blend-mode - CSS:层叠样式表 | MDN
mix-blend-mode: difference;
3.数据并排展示
column-count:2; 让数据呈现2列展示或者指定列宽,系统自动填充column-width: 200px;
本文介绍了如何使用CSS滤镜如grayscale()调整图像灰度,brightness()改变亮度,blur()实现模糊效果,以及mix-blend-mode属性来混合子元素与父元素的颜色。这些技术在网页设计中具有重要作用,提升视觉效果。

529

被折叠的 条评论
为什么被折叠?



