CSS3属性box-shadow使用指南


Posted in HTML / CSS onDecember 09, 2014

今天比较忙,没能好好看新东西,就记录一个常用的CSS3属性吧:box-shadow,表示阴影,如果设置了border-radius圆角,则阴影也是圆角

box-shadow目前是IE9及以上和其他现代浏览器都支持的属性了。

语法:

Formal syntax: none | [inset? && [ <offset-x> <offset-y> <blur-radius>? <spread-radius>? <color>? ] ]#

取值:

inset: 表示阴影在边框内部(即使是无边框),在背景之上,内容之下;

offset-x 和 offset-y: 偏移量,正值表示向左和向下;

blur-radius: 模糊半径,默认0,不能为负值;

spread-radius: 取正值阴影扩大,取负值缩小,默认为0.

color: 颜色,所未定义则由浏览器确定。

HTML / CSS 相关文章推荐
CSS3 background-image颜色渐变的实现代码
Sep 13 HTML / CSS
CSS3制作炫酷的自定义发光文字
Mar 28 HTML / CSS
使用CSS3编写灰阶滤镜来制作黑白照片效果的方法
May 09 HTML / CSS
10分钟入门CSS3 Animation
Dec 25 HTML / CSS
HTML5 通信API 跨域门槛将不再高、数据推送也不再是梦
Apr 25 HTML / CSS
HTML5注册表单的自动聚焦与占位文本示例代码
Jul 19 HTML / CSS
Web时代变迁及html5与html4的区别
Jan 06 HTML / CSS
使用spring mvc+localResizeIMG实现HTML5端图片压缩上传的功能
Dec 16 HTML / CSS
HTML5本地存储之IndexedDB
Jun 16 HTML / CSS
canvas实现圆形进度条动画的示例代码
Dec 26 HTML / CSS
canvas里面如何基于随机点绘制一个多边形的方法
Jun 13 HTML / CSS
教你做个可爱的css滑动导航条
Jun 15 HTML / CSS
CSS3属性box-sizing使用指南
Dec 09 #HTML / CSS
使用css3实现的tab选项卡代码分享
Dec 09 #HTML / CSS
使用css3实现的windows8开机加载动画
Dec 09 #HTML / CSS
css3的transform中scale缩放详解
Dec 08 #HTML / CSS
css3实例教程 一款纯css3实现的发光屏幕旋转特效
Dec 07 #HTML / CSS
css3的transform造成z-index无效解决方案
Dec 04 #HTML / CSS
一款利用纯css3实现的超炫3D表单的实例教程
Dec 01 #HTML / CSS
You might like
收集的PHP中与数组相关的函数
2007/03/22 PHP
PHP5.2中PDO的简单使用方法
2016/03/25 PHP
浅谈javascript 面向对象编程
2009/10/28 Javascript
iframe父页面获取子页面参数的方法
2014/02/21 Javascript
Javascript中的String对象详谈
2014/03/03 Javascript
jQuery实现购物车计算价格功能的方法
2015/03/25 Javascript
基于jquery实现简单的手风琴特效
2015/11/24 Javascript
jquery插入兄弟节点的操作方法
2016/12/07 Javascript
利用Chrome DevTools直接调试Node.js和JavaScript的方法详解(并行)
2017/02/16 Javascript
bootstrapValidator 重新启用提交按钮的方法
2017/02/20 Javascript
js实现轮播图的两种方式(构造函数、面向对象)
2017/09/30 Javascript
原生js实现移动端触摸轮播的示例代码
2017/12/22 Javascript
javascript中函数的写法实例代码详解
2018/10/28 Javascript
微信小程序http连接访问解决方案的示例
2018/11/05 Javascript
jQuery实现数字自动增加或者减少的动画效果示例
2018/12/11 jQuery
详解key在Vue列表渲染时究竟起到了什么作用
2019/04/20 Javascript
node中实现删除目录的几种方法
2019/06/24 Javascript
如何解决日期函数new Date()浏览器兼容性问题
2019/09/11 Javascript
微信小程序实现分享商品海报功能
2019/09/30 Javascript
[01:28]国服启动器接入蒸汽平台操作流程视频
2021/03/11 DOTA
用python分割TXT文件成4K的TXT文件
2009/05/23 Python
Python实现文件内容批量追加的方法示例
2017/08/29 Python
Numpy中的mask的使用
2018/07/21 Python
Python3.5迭代器与生成器用法实例分析
2019/04/30 Python
Python closure闭包解释及其注意点详解
2019/08/28 Python
keras-siamese用自己的数据集实现详解
2020/06/10 Python
Python第三方库安装缓慢的解决方法
2021/02/06 Python
蔻驰英国官网:COACH英国
2020/07/19 全球购物
机电专业大学生求职信
2013/10/04 职场文书
大学四年个人的自我评价
2014/02/26 职场文书
小班上学期评语
2014/05/05 职场文书
计算机系本科生求职信
2014/05/31 职场文书
放飞梦想演讲稿600字
2014/08/26 职场文书
幼儿园感恩节活动方案2014
2014/10/11 职场文书
2014年电教工作总结
2014/12/19 职场文书
如何写好竞聘报告
2019/04/03 职场文书