需求：

对图片做css羽化处理

实现：

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="Generator" content="EditPlus&reg;" />
  6. <meta name="Author" content="" />
  7. <meta name="Keywords" content="" />
  8. <meta name="Description" content="" />
  9. <title>Document</title>
  10. </head>
  11. <body>
  12. <img style="display: block;  height: 100%;width: 100%;" src="http://js.linkrmb.com/mt.jpg" />
  13. <div style="
  14. position: absolute;
  15. top: 0;
  16. height: 100%;
  17. width: 100%;
  18. box-shadow: 0 0 70px 30px rgb(249, 249, 249) inset;"></div>
  19. </body>
  20. </html>

效果：

css之图片羽化处理的更多相关文章

  1. Django调用JS、CSS、图片等静态文件

    zz 在下面的例子中,我们将media作为静态(CSS\JS\图片文件)文件的目录 方法一. 1.首先在settings.py文件中自定义参数 STATIC_PATH=’./media’ .(意为当前 ...

  2. Bootstrap css背景图片的设置

    一. 网页中添加图片的方式有两种 一种是:通过<img>标签直接插入到html中 另一种是:通过css背景属性添加 居中方法:水平居中的text-align:center 和 margin ...

  3. 使用CSS将图片转换成黑白(灰色、置灰)z转

    小tip: 使用CSS将图片转换成黑白(灰色.置灰) by zhangxinxu from http://www.zhangxinxu.com 本文地址:http://www.zhangxinxu.c ...

  4. Spring MVC程序中得到静态资源文件css,js,图片

    转载自:http://www.blogjava.net/fiele/archive/2014/08/24/417283.html 用 Spring MVC 开发应用程序,对于初学者有一个很头疼的问题, ...

  5. css背景图片拉伸 以及100% 满屏显示

    如何用css背景图片拉伸 以及100% 满屏显示呢?这个问题听起来似乎很简单.但是很遗憾的告诉大家.不是我们想的那么简单. 比如一个容器(body,div,span)中设定一个背景.这个背景的长宽值在 ...

  6. 网站性能优化之CSS无图片技术：三角形

    1.使用CSS无图片技术,可以总结得到以下三个优点: 减少请求资源的大小: 减少http的请求个数: 提高可维护性. 一.CSS无图片技术,微博中有哪些实际应用呢? 通过上面的展示,我们可以看到,无图 ...

  7. mvc伪静态<四> 伪静态后静态页面或者引用的css和图片失效

    引用的css和图片失效的解决办法 把样式引用文件的相对路径改成绝对路径就可以了 比如原先的引用路径为:<link href="~/Content/css/style.css" ...

  8. CSS实现图片快速等比例缩放，效果佳

    初学者在实现图片等比例缩放,通常会使用js编写逻辑来控制高或宽,达到自动缩放的效果. 这里提供一种纯CSS的图片缩放功能,请看代码: <style type="text/css&quo ...

  9. 小tip: 使用CSS将图片转换成模糊(毛玻璃)效果

    去年盛夏之时,曾写过“小tip: 使用CSS将图片转换成黑白”一文,本文的模式以及内容其实走得是类似路线.CSS3 → SVG → IE filter → canvas. 前段时间,iOS7不是瓜未熟 ...

随机推荐

  1. HTTP协议-缓存

    HTTP 协议中,缓存更多关心的文档资源的再利用.其目的是减少数据传输,加快相应速度等等.而对于缓存采用的是什么方案,也就是存在内存中还是硬盘中之类的问题,就属于另外的内容了. 假设,我身在广东,但是 ...

  2. NOI经验谈

    对于NOI来说,甚至比硬实力更加重要.我觉得一场考试这么几件事要做:看题,选题,分析,编码,调试,测试,骗分. 1.看题 拿到试卷以后的第一件事就是看题.看题不是看小说,要仔细阅读.当然,阅读也不宜过 ...

  3. CentOS 7 yum 安装subversion

    yum list installed | grep subversionyum install subversioncd /var/wwwsvn -hsvn co svn://121.196.226. ...

  4. 本地hosts文件IP地址解析

    localhost是一个域名,127.0.0.1为IP地址.Windows系统中,约定127.0.0.1为本地IP地址.localhost是其对应的域名.配置是在hosts文件中设置的,Windows ...

  5. GET POST方法长度限制(转)

    1.    Get方法长度限制 Http Get方法提交的数据大小长度并没有限制,HTTP协议规范没有对URL长度进行限制.这个限制是特定的浏览器及服务器对它的限制. 如:IE对URL长度的限制是20 ...

  6. 关于STM32数据手册中的定时器信号

    首先,我们可以看到这个图大概有两个不分,一个部分是时钟源,另一个部分则是输入输出 时钟源计数,到CNT计数器,然后根据捕获比较寄存器进行记录或比较.记录或比较有不同的配置. 首先是TI信号TI1 TI ...

  7. Android 解压zip文件

    过了n多天后,当再次使用原先博客上写的那篇: Android 压缩解压zip文件 去做zip包的解压的时候,出现了原来没有发现的很多问题.首先是中文汉字问题,使用java的zip包不能很好的解决解压问 ...

  8. 关于curl: (2) Failed Initialization

    一開始是由于curl无法訪问https网上说,要又一次编译安装curl 我就下载.. ./configure make make install 结果出现 curl: (2) Failed Initi ...

  9. 安装oracle10g“程序异常终止。发生内部错误。请将以下文件提供给oracle技术支持部门

    发生情景:测试环境搭建的是windows 2008 r2 sp1系统 在安装Oracle 10g数据库时发生了错误,现在把解决问题的方法和原因分享给大家. *  安装出现的现象: 输入完密码后下一步时 ...

  10. c#开发activex注册问题

    最近使用c#开发activex,遇到一个问题,生成的dll文件在本地可以嵌入到web里面,但是到其他机器上就会出现activex无法加载的情况,页面里面出现一个红色的X.mfc开发的activex是使 ...