CSS3 Filter滤镜效果
关注到它是在一次分享会当中,很神奇,只需写一行代码就可以变身很美的视觉效果,这就是CSS3滤镜。
语法
filter:fuction(param);
如今浏览器支持情况相比以前乐观很多,点击查看兼容
方法
1.blur模糊
2.brightness亮度
3.contrast对比度
4.grayscale灰度
5.hue-rotate色相旋转
6.invert反色
7.opacity透明度
8.saturate饱和度
9.sepia褐色
10.drop-shadow阴影
效果(非截图)
比较喜欢的三种滤镜
CSS3 Filter滤镜效果的更多相关文章
- CSS3 filter 模糊滤镜的应用
CSS3 filter 模糊滤镜的应用 在segmentfault上回答过的一个问题,如何将网页CSS背景图高斯模糊且全屏显示当时没有深入了解,只觉得滤镜应该只是应用于图片上的.而且各大网站的de ...
- CSS3 Filter详解(改变模糊度 亮度 透明度等方法)
CSS3 Filter(滤镜)属性提供了提供模糊和改变元素颜色的功能.CSS3 Fitler 常用于调整图像的渲染.背景或边框显示效果. -webkit-filter是css3的一个属性,Webkit ...
- CSS3 filter:drop-shadow滤镜与box-shadow区别应用 抄的
CSS3 filter:drop-shadow滤镜与box-shadow区别应用 这篇文章发布于 2016年05月18日,星期三,01:07,归类于 css相关. 阅读 5777 次, 今日 12 次 ...
- [转]CSS3 Filter的十种特效
最近到处看到有人在说CSS3的filter一直没有时间自己去测试这效果.今天终于抽出时间学习这个CSS3的Filter.不整不知道呀,一整才让我感到吃惊,太强大了.大家先来看个效果吧: 我想光看上面的 ...
- CSS3 Filter特效
CSS3 filter和IE的filter完全是两样东东. Filters主要是运用在图片上,以实现一些特效.(尽管他们也能运用于video上),不过我们在些只来讨论图片上的运用. 语法 elm { ...
- 巧用 CSS3 filter(滤镜) 属性
原文链接:CSS3 filter(滤镜) 属性 效果预览 filter: grayscale(100%); 定义和使用 filter 属性定义了元素(通常是<img>)的可视效果(例如:模 ...
- filter滤镜效果(css3属性)
<!DOCTYPE html> <html> <head> <style> img { width: 33%; height: auto; float: ...
- css3 filter属性在项目中的应用
css3 属性filter应用在项目里. 语法: <filter>: 要使用的滤镜效果.多个滤镜之间用空格隔开. 设置或检索对象所应用的滤镜效果. 最常用的滤镜效果是不透明效果,如果要实现 ...
- 【转载】CSS3 filter:drop-shadow滤镜与box-shadow区别应用
文章转载自 张鑫旭-鑫空间-鑫生活 http://www.zhangxinxu.com/wordpress/ 原文链接:http://www.zhangxinxu.com/wordpress/?p=5 ...
随机推荐
- 需要我们了解的SQL Server阻塞原因与解决方法
需要我们了解的SQL Server阻塞原因与解决方法 上篇说SQL Server应用模式之OLTP系统性能分析.五种角度分析sql性能问题.本章依然是SQL性能 五种角度其一“阻塞与死锁” 这里通过连 ...
- C#中WindowsForm常见控件的运用
C#中WindowsForm常见控件的运用 -- 1.button(曹操,贡天子以令不臣): 属性;text:我们经常可以看见将按钮命名为“登入”,在其属性面板里面编辑text即可:如下图: ...
- Visual Studio属性配置中使用宏
在学习C语言的时候,我们曾经遇到过一个宏的概念.宏的作用机理本质上是宏的展开,C语言中的宏的用法也有很多种(水其实很深...),不过从感觉上来讲,人们大致上会在以下的场景中,利用宏来解决一些窘境:一是 ...
- android 豆瓣客户端 视频
链接如下:http://download.csdn.net/detail/jltxgcy/5667337
- 最近修bug的一点感悟
写在前面话 项目从13年1月份,现场开发,4月中旬,项目开发接近尾声,三个开发,留两个在现场,我被调回公司,5月份现场一同事离职,只有一个同事在开发,结果PM想让这一个同事承担余下的开发和bug工作, ...
- 结构-行为-样式 - Angularjs 环境下Ztree结合JqueryUI实现拖拽
新的项目中有一个需求是要求客户标签可以自定义,于是就想到了客户体验,让客户自己拖拽标签进行组合查询.但是理想很丰满,现实很骨感.一开始就遇到了问题,各个插件之间的结合问题,折腾一翻之后终于实现了这个功 ...
- ASP.NET Zero--11.一个例子(4)商品分类管理-数据检验
虽然已经可以添加商品分类,但还需进行优化,比如:用户是否输入.输入字符串是否有格式限制等等. 打开添加分类按钮,名称不输入任何字符,直接保存,会发现列表添加一条空记录.在实际项目中,这是不允许出现的事 ...
- jquery中这句 .stop(false,true); 什么意思
.stop 是jQuery中用于控制页面动画效果的方法.运行之后立刻结束当前页面上的动画效果.stop在新版jQuery中添加了2个参数:第一个参数的意思是是否清空动画序列,也就是stop的是当前元素 ...
- 有关css3的一些问题
CSS3新特性(阴影.动画.渐变.变形.伪元素等) CSS3与页面布局学习总结--CSS3新特性(阴影.动画.渐变.变形.伪元素等) 目录 一.阴影 1.1.文字阴影 1.2.盒子阴影 二.背 ...
- iOS软件架构——架构模式(Architectural Pattern)
一个架构模式描述软件系统里的基本的结构组织或纲要.架构模式提供一些事先定义好的子系统,指定它们的责任,并给出把它们组织在一起的法则和指南.有些作者把这种架构模式叫做系统模式[STELTING02]. ...