模糊实例

图片使用高斯模糊效果：

img {

    -webkit-filter: blur(5px); /* Chrome, Safari, Opera */

    filter: blur(5px);

}

css语法：

filter: none | blur() | brightness() | contrast() | drop-shadow() | grayscale() | hue-rotate() | invert() | opacity() | saturate() | sepia() | url();

更多效果可参考官网 https://www.runoob.com/cssref/css3-pr-filter.html

css实习滤镜效果（背景图模糊）的更多相关文章

  1. DIV+CSS+PS实现背景图的三层嵌套以及背景图的合并

    传说中的“三层嵌套技术”. 一.背景图合并: div+css+ps合图相结合的技术:通过精确到1px的css设置,使用ps合成背景图片,特别是小图片合并,来完成页面效果.         首先讲讲三层 ...

  2. webpack中，css中打包背景图，路径报错

    css-loader: //打包样式中背景图 { test: /\.(png|jpg)$/, loader: "url-loader?limit=8192&name=images/[ ...

  3. vue-cli构建的vue项目打包后css引入的背景图路径不对的问题

    使用vue-cli构建vue项目后,再打包遇到一个css引入的背景图片路径的问题,就是css代码中背景图片是根据相对路径来写的,如下图: 当使用npm run dev命令本地访问的时候,背景图片是正常 ...

  4. css — 定位、背景图、水平垂直居中

    目录 1. 定位 2. 背景图 3. 水平垂直居中 1. 定位 position:static | relative | absolute | fixed; static 静态定位 relative ...

  5. HTML引用CSS实现自适应背景图

    链接图片背景代码 body {background: url('链接') no-repeat center 0;} 颜色代码 body{background:#FFF} 链接图片背景代码2 <b ...

  6. 关于CSS设置页面背景图的一些疑问

    关于背景图片的位置其background-position设置背景图片的位置有两种方式,一种是是根据像素设置,第二种根据百分比设置,第一种根据像素的位置是很简单的,只是关于百分比这个设置理解特别容易出 ...

  7. 在css中设置图片的背景图，怎么设置图片纵向拉伸

    css中设置背景图拉伸填充,在css2.1之前这个背景的长宽值是不能被修改的. 实际的结果是只能重复显示,可以使用repeat,repeat-x,repeat-y,no-repeat这些属性来控制背景 ...

  8. vue-cli打包后dist文件运行空白和背景图显示问题详解

    1.文件引用路径.我们直接运行打包后的文件夹中的index.html文件,会看到网页一片空白,f12调试,全是css,js路径引用错误的问题. 解决:到config文件夹中打开index.js文件. ...

  9. CSS之全屏背景图

    吐槽啦:Yeah  明天就是国庆了o(*￣▽￣*)o!哈哈,提前祝福各位园友国庆快乐.假期愉快.生活美满.天天开心!国庆我要回家一趟,把一些不用的东西带回家,走访一下亲朋好友,在家打几天酱油~~~ 言 ...

随机推荐

  1. 矩阵顺时针打印（C++）（？ 为什么不能AC，9度1391）

    #include <iostream> #include <fstream> using namespace std; int a[1000][1000]; void prin ...

  2. vulnhub靶场之THE PLANETS: EARTH

    准备: 攻击机:虚拟机kali.本机win10. 靶机:THE PLANETS: EARTH,网段地址我这里设置的桥接,所以与本机电脑在同一网段,下载地址:https://download.vulnh ...

  3. windows设置开机启动程序

    1.新建文件,填写路径 @echo off cd F:\程序路径\ //后面填写3D所在的路径 F: //程序的个盘符 run.bat 把这个文件填写完成后,改个名字,后缀改为bat,并把这个文件放在 ...

  4. 删除数组里含有a的元素，并且将null值放在后面

    想去掉里面含有a的元素,并将null放在后面.放在后面就是往后移,其他值往左移 1 public static void main(String[] args) { 2 //自定义的一个数组 3 St ...

  5. 一天一道Java面试题----第十二天（如何实现接口幂等性）

    这里是参考B站上的大佬做的面试题笔记.大家也可以去看视频讲解!!! 文章目录 1.如何实现接口幂等性 1.如何实现接口幂等性 唯一id.每次操作,都根据操作和内容生成唯一的id,在执行之前先判断id是 ...

  6. ysoserial commonscollections3 分析

    cc3利用链如下: TrAXFilter(Templates templates) TemplatesImpl->newTransformer() TemplatesImpl->getTr ...

  7. Nginx实用配置-2

    Nginx配置-2 1.升级Openssl [root@rocky8 ~]# nginx -V #查看现在nginx的OpenSSL版本和编译情况 nginx version: nginx/1.22. ...

  8. 51单片机-独立按键控制led矩阵的左移和右移

    51单片机学习 独立按键 控制led灯光矩阵的左移和右移 开发板采用的是普中的A2学习开发板,具体的代码如下: typedef unsigned int u16; void delay(u16 tim ...

  9. SqlDataAdapter使用小结

    SqlDataAdapter是 DataSet与SQL Server之间的桥接器,用于相互之间的数据操作. 使用方法 1. 通过查询语句 与 SqlConnection对象实现 string strC ...

  10. 剖析一下"抢茅台"脚本底层逻辑

    本文作者:梁东东 前言: 今天你撸茅台了么? 撸茅台已经成为社会现象,茶余饭后讨论的最佳实践 2022年双十一大促已经完美收官,兄弟姐妹克服种种困难与挑战.. 备战的会议室忙碌中带着紧张,当峰值过后的 ...