css3阴影 box-shadow
语法
box-shadow:X轴偏移量 y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式]
参数介绍:

注:inset 可以写在参数的第一个或最后一个,其它位置是无效的。
阴影模糊半径,其值只能为正值,值越大阴影边缘就越模糊,值为0时阴影不具有模糊效果。
阴影扩展半径,其值可以为正负值,值为正,阴影扩大,值为负,阴影缩小
用法
外阴影: box-shadow: 0px 0px 12px 5px #33CC00;

内阴影:box-shadow:0px 0px 12px 5px #33CC00 inset ;

当外阴影设置了偏移量:box-shadow:5px 4px 6px #666;

当内阴影设置了偏移量:box-shadow:5px 5px 5px #666 inset;

只设置X,Y偏移量:box-shadow:10px 10px #666;

在上个基础上加阴影模糊半径和阴影扩展半径:box-shadow:10px 10px 5px 10px #666;

多个阴影: box-shadow:4px 2px 6px #f00, -4px -2px 6px #000, 0px 0px 12px 5px #33CC00 inset;

css3阴影 box-shadow的更多相关文章
- CSS3阴影 box-shadow的使用和技巧总结
text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果.随着html5和CSS3的普及,这一特殊效果使用越来越普遍. 基本语法是{box-shadow:[inset ...
- 【转】 CSS3阴影 box-shadow的使用和技巧总结
text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果.随着html5和CSS3的普及,这一特殊效果使用越来越普遍. 基本语法是{box-shadow:[inset ...
- CSS3阴影 box-shadow的使用
text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果.随着html5和CSS3的普及,这一特殊效果使用越来越普遍. 基本语法是{box-shadow:[ins ...
- CSS3阴影 box-shadow的使用总结
text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果.随着html5和CSS3的普及,这一特殊效果使用越来越普遍. 基本语法是{box-shadow:[inset ...
- OpenGL阴影,Shadow Volumes(附源程序,使用 VCGlib )
实验平台:Win7,VS2010 先上结果截图: 本文是我前一篇博客:OpenGL阴影,Shadow Mapping(附源程序)的下篇,描述两个最常用的阴影技术中的第二个,Shadow Volu ...
- OpenGL阴影,Shadow Mapping(附源程序)
实验平台:Win7,VS2010 先上结果截图(文章最后下载程序,解压后直接运行BIN文件夹下的EXE程序): 本文描述图形学的两个最常用的阴影技术之一,Shadow Mapping方法(另一种是Sh ...
- OpenGL 阴影之Shadow Mapping和Shadow Volumes
先说下开发环境.VS2013,C++空项目,引用glut,glew.glut包含基本窗口操作,免去我们自己新建win32窗口一些操作.glew使我们能使用最新opengl的API,因winodw本身只 ...
- 阴影锥(shadow volume)原理与展望
转记:找了不少关于shadow volume原理的资料,还是这个帖子讲解的一目了然,转帖在这里,方便查阅.引用链接:http://blog.donews.com/yyh/archive/2005/05 ...
- CSS3 Flex Box(弹性盒子)
CSS3 Flex Box(弹性盒子) 一.简介 弹性盒子是 CSS3 的一种新的布局模式. CSS3 弹性盒( Flexible Box 或 flexbox),是一种当页面需要适应不同的屏幕大小以及 ...
- 分享div、text、Box Shadow(阴影)演示及代码的页面
附图: 直接上链接:www.css88.com/tool/css3Preview/Box-Shadow.html
随机推荐
- mc04_IntelliJ IDEA常用设置
字体设置 File --> Settings --> Font 项目编码设置 File --> Settings --> File Encodings 项目依赖 即一个项目引用 ...
- element-ui表单验证(电话,邮箱)
element-ui Form表单验证 最近刚好使用了element-ui的form表单,官网只提供的示例,这里把一些常用的验证记录下来,方便后期查找最终的效果是这样的, 这个表单里还加入了一下其他组 ...
- app常见测试点
安装与卸载: ●应用是否可以在IOS不同系统版本或android不同系统版本上安装(有的系统版本过低,应用不能适配) ●软件安装后是否可以正常运行,安装后的文件夹及文件是否可以写到指定的目录里. ●安 ...
- [转]如何在.NET MVC中使用jQuery并返回JSON数据
本文转自:http://blog.sina.com.cn/s/blog_48e42dc90100xp1p.html 二.开始实践 - jQuery端 假设我们要从服务器端获取一个文章列表,并把文章条目 ...
- PHP 魔术方法__set() __get() 方法详解
__set() is run when writing data to inaccessible properties. __get() is utilized for reading data fr ...
- php字符串函数详解
nl2br 功能:化换行符为<br> <?php $str = "cat isn't \n dog"; $result = nl2br($str); echo $ ...
- EF删除数据
1.方法一,面向对象 using (MyDbContent content = new MyDbContent()) { content.Entry<UserInfo>(model).St ...
- iOS开发实践之多线程(单例模式)
单例模式的作用:可以保证在程序运行过程,一个类只有一个实例,而且该实例易于供外界访问,从而方便地控制了实例个数,并节约系统资源. 单例模式的使用场合:在这个应用程序中,共享一份资源(这份资源只需要创建 ...
- 显卡(GPU)的基础知识
显卡的性能指标有: 流处理器(SP)数量 核心频率 流处理器的架构 显存容量 显存频率 显存带宽 1. 流处理器的数量 把一个GPU当成是一个画画的工厂,其中流处理器的数量就是画师的数量,其数量自然是 ...
- Version Control&Git
首先了解一下什么是版本控制: Version control (版本控制)是指对软件开发过程中各种程序代码.配置文件及说明文档等文件变更的管理,是软件配置管理的核心思想之一. 其次版本控制最主要的功能 ...