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实现粒子旋转伸缩加载动画
Apr 22 HTML / CSS
前端canvas动画如何转成mp4视频的方法
Jun 17 HTML / CSS
Html5内唤醒百度、高德APP的实现示例
May 20 HTML / CSS
使用 HTML5 Canvas 制作水波纹效果点击图片就会触发
Sep 15 HTML / CSS
详解HTML5中的manifest缓存使用
Sep 09 HTML / CSS
详解HTML5中rel属性的prefetch预加载功能使用
May 06 HTML / CSS
HTML5 canvas基本绘图之填充样式实现
Jun 27 HTML / CSS
HTML5实现移动端复制功能
Apr 19 HTML / CSS
html5实现滑块功能之type=&quot;range&quot;属性
Feb 18 HTML / CSS
HTML里显示pdf、word、xls、ppt的方法示例
Apr 14 HTML / CSS
HTML5获取当前地理位置并在百度地图上展示的实例
Jul 10 HTML / CSS
amaze ui 的使用详细教程
Aug 19 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的变量总结 新手推荐
2011/04/18 PHP
PHP对象的浅复制与深复制的实例详解
2017/10/26 PHP
jQuery动态设置form表单的enctype值(实现代码)
2013/07/04 Javascript
JavaScript实现Iterator模式实例分析
2015/06/09 Javascript
Javascript操作表单实例讲解(下)
2016/06/20 Javascript
BootStrap 超链接变按钮的实现方法
2016/09/25 Javascript
基于jQuery插件jqzoom实现的图片放大镜效果示例
2017/01/23 Javascript
javascript设计模式之中介者模式学习笔记
2017/02/15 Javascript
微信小程序 MD5的方法详解及实例代码
2017/03/10 Javascript
js编写简单的聊天室功能
2017/08/17 Javascript
浅谈微信小程序之官方UI框架we-ui使用教程
2018/08/20 Javascript
laydate只显示时分 不显示秒的功能实现方法
2019/09/28 Javascript
[48:37]EG vs OG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
[48:48]完美世界DOTA2联赛PWL S3 Magama vs GXR 第一场 12.19
2020/12/24 DOTA
Python set集合类型操作总结
2014/11/07 Python
如何处理Python3.4 使用pymssql 乱码问题
2016/01/08 Python
学习python之编写简单简单连接数据库并执行查询操作
2016/02/27 Python
使用Turtle画正螺旋线的方法
2017/09/22 Python
django Serializer序列化使用方法详解
2018/10/16 Python
对Python之gzip文件读写的方法详解
2019/02/08 Python
详解Python修复遥感影像条带的两种方式
2020/02/23 Python
关于jupyter打开之后不能直接跳转到浏览器的解决方式
2020/04/13 Python
python爬取微博评论的实例讲解
2021/01/15 Python
生物有机护肤品:Aurelia Probiotic Skincare
2018/01/31 全球购物
优瑞自动咖啡机官网:Jura
2018/09/29 全球购物
西班牙购买行李箱和背包网站:Maletas Greenwich
2019/10/08 全球购物
宿舍使用违章电器检讨书
2014/01/12 职场文书
彩色的非洲教学反思
2014/02/18 职场文书
社区义诊活动总结
2014/04/30 职场文书
感恩教育活动总结
2014/05/05 职场文书
2014年母亲节寄语
2014/05/07 职场文书
电子商务专业应届生求职信
2014/05/28 职场文书
2015年庆祝国庆节66周年演讲稿
2015/07/30 职场文书
CI Games宣布《堕落之王2》使用虚幻引擎5制作 预计将于2023年正式发售
2022/04/11 其他游戏
详解Vue3使用axios的配置教程
2022/04/29 Vue.js
如何使用注解方式实现 Redis 分布式锁
2022/07/23 Redis