快生活 - 生活常识大全

使用如何将图片生成模糊效果


  在写htm代码时,有时候需要将网页图片转为模糊效果,下面就来介绍一下。
  一、创建一个htm文件,我们要处理的图片放在同一个目录下。
  二、用文本工具打开htm文件,img加上图片链接。
  三、打开浏览器我们可以开电脑图片是正常清晰的。
  四、回到htm代码在
  <style>加上css样式,blur后面数字为模糊度,数字为0表示原图,数字越大越模糊,大家只要调节这个数字到需要的效果即可。上下两个需要同步更新一样的,使用不同内核的浏览器。
  img {
  -webkit-filter: blur(5px); /* Chrome, Safari, Opera */
  filter: blur(5px);
  }
  五、修改完成保存,重新刷新htm页面,我们看到刚才的清晰图片已经变模糊了。
  六、代码很简单,如果不想敲代码的话,可以直接打开http://dwz.date/ac8C下载即可,图片大家可以根据实际来更换即可。
  </style>
网站目录投稿:沛容