是时候使用filter:drop-shadow了

标签: CSS Resource box-shadow css filter | 发表时间:2012-10-11 18:59 | 作者:神飞
出处:http://www.qianduan.net

前些天在做一个项目的时候,用到了阴影,阴影是个方向都有的,于是写了一大坨box-shadow来实现,然后今天看到bricss说到filter:drop-shadow,豁然开朗。

具体的实现不用不细讲了,直接看代码:

box-shadow方案:

1
2
3
.box-shadow {
box-shadow: rgba(0,0,0,.5) 0 1px 5px;
}

drop-shadow滤镜方案:

1
2
3
4
5
6
7
.filter-drop-shadow {
-webkit-filter: drop-shadow(0 1px 5px rgba(0,0,0,.5));
-moz-filter: drop-shadow(0 1px 5px rgba(0,0,0,.5));
-ms-filter: drop-shadow(0 1px 5px rgba(0,0,0,.5));
-o-filter: drop-shadow(0 1px 5px rgba(0,0,0,.5));
filter: drop-shadow(0 1px 5px rgba(0,0,0,.5));
}

效果对比:

线上demo: http://dabblet.com/gist/3820382

关于drop-shadow这个滤镜:

  • 不了解filter的同学请访问: -webkit-filter是神马?
  • chrome从21版本开始支持(现在主流版本是22),Safari 6和ios 6中Safari也都支持
  • firefox、Opera、ie继续用box-shadow吧

filter规范现在由webkit和adobe在推,firefox在跟进,ie10也支持一点点了,所以在webkit上,可以实现更好的效果,为什么不用呢?

参考: http://bricss.net/post/33158273857

相关 [是时候 filter drop] 推荐:

Servlet Filter 学习

- - CSDN博客架构设计推荐文章
最近在研究CAS , CAS 中的Servlet Filter 不太熟悉, 所以花了点时间学下了下这部分的知识, 分成以下几部分 学习. Servlet Filter  的功能和用法. Servlet Filter 顺序的注意事项. A filter is an object that performs filtering tasks on either the request to a resource (a servlet or static content), or on the response from a resource, or both.

Servlet、Filter和Listener

- - Web前端 - ITeye博客
Java Servlet是与平台无关的服务器端组件,运行于Servlet容器中(如Tomcat),Servlet容器负责Servlet和客户端的通信以及调用Servlet的方法,Servlet和客户端的通信采用“请求/响应”的模式. Servlet可完成以下功能:. 1、创建并返回基于客户请求的动态HTML页面.

Bloom Filter 原理与应用

- - CSDN博客云计算推荐文章
Bloom Filter是一种简单的节省空间的随机化的数据结构,支持用户查询的集合. 一般我们使用STL的std::set, stdext::hash_set,std::set是用红黑树实现的,stdext::hash_set是用桶式哈希表. 上述两种数据结构,都会需要保存原始数据信息,当数据量较大时,内存就会是个问题.

dubbo中的Filter顺序

- - 互联网 - ITeye博客
最近发现dubbo的小 bug,顺便整理了一下dubbo中的Filter调用顺序及如何确定的. 服务提供方的过滤器被调用顺序:. EchoFilter->ClassLoaderFilter->GenericFilter->ContextFilter->(这4个是在代码中指定的). 服务消费方的过滤器顺序:.

mysql删除大表更快的drop table办法

- 胖岁 - haohtml's blog
曾经发文介绍过,DROP table XXX ,特别是碰到大表时,. 在DROP TABLE 过程中,所有操作都会被HANG住. 这是因为INNODB会维护一个全局独占锁(在table cache上面),直到DROP TABLE完成才释放. 在我们常用的ext3,ext4,ntfs文件系统,要删除一个大文件(几十G,甚至几百G)还是需要点时间的.

人人网首页拖拽上传详解(HTML5 Drag&Drop、FileReader API、formdata)

- - 彬Go
  早在公元2011年6月3日傍晚,人人网推出了一个很装B且完全无视IE浏览器的功能——拖拽上床. 哦,Sorry, 是 拖拽上传. 到现在,这个功能已经上线了整整半年,这篇文章也足足拖延了半年才分享给大家,实在是对不住了,呵呵,今后彬Go一定要勤奋发Blog. 您还可以参考以下HTML5相关文章:.

activity、 intent 、intent filter、service、Broadcast、BroadcaseReceiver解释

- - CSDN博客推荐文章
Android中,Activity是所有程序的根本,所有程序的流程都运行在Activity之中,Activity具有自己的生命周期(由系统控制生命周期,程序无法改变,但可以用onSaveInstanceState保存其状态). 对于Activity,关键是其生命周期的把握(如那张经典的生命周期图=.=),其次就是状态的保存和恢复(onSaveInstanceState onRestoreInstanceState),以及Activity之间的跳转和数据传输(intent).

webservice的安全机制3---Filter

- - 博客园_首页
本节摘要:本节继续讨论webservice的安全机制,本节采用servlet的过滤器Filter来实现.    前面讲了webservice的安全机制1和2,本节继续webservice的安全之旅,.    本节采用servlet的Filter的来实现对webservice的安全访问.    在调用webservice之前,过滤器会拦截匹配的请求,只有满足安全要求的客户端才能访问webservice服务.

【转】Servlet 和filter 执行顺序

- - 企业架构 - ITeye博客
一,servlet容器对url的匹配过程:. 当一个请求发送到servlet容器的时候,容器 先会将请求的url减去当前应用上下文的路径作为servlet的映射url,比如我访问的是http://localhost/test /aaa.html,我的应用上下文是test,容器会将http://localhost/test去掉,剩下的/aaa.html部分拿来做 servlet的映射匹配.

[译]JVM上最快的Bloom filter实现

- - 鸟窝
英文原始出处: Bloom filter for Scala, the fastest for JVM. 本文介绍的是我用Scala实现的Bloom filter. 依照 性能测试结果,它是JVM上的 最快的Bloom filter实现. 零分配(Zero-allocation)和高度优化的代码.