页面特效 UI组件库 菜单导航 窗口特效 幻灯片滑动 图像相册 表单 选项卡 表格 评分星级 手风琴 文本链接 布局 日历 颜色选择器 按钮 图表 html5 提示 ExtJS 在线客服 其他特效 地图 树形控件 移动开发 BootStrap 滑动条 文件上传 表单验证 分页 播放器 Angular VUE

64种常用CSS3阴影效果样式库

布局 HTML我帮您 14天前  次浏览

box-shadows.css是一款集成了64种CSS3阴影效果的CSS样式库。使用box-shadows.css阴影养生库,你只需要在元素上添加相应的class类,既可以快速的生成相应的阴影效果。

box-shadows.css是一款集成了64种CSS3阴影效果的CSS样式库

使用方法

在页面中引入box-shadows.css文件。
<link rel="stylesheet" href="box-shadows.css">
HTML结构

在页面中需要添加的阴影效果的元素上添加bShadow class。
<div class="bShadow"></div>

然后添加你需要的阴影效果的class类,例如:
<div class="bShadow bShadow-1"></div>

或者,可以直接添加阴影效果的class类,而不用添加bShadow class。
<div class="bShadow-1"></div>

bShadow是一个主题分类,可用的分类还有:bShadow-light(默认)和bShadow-inset,通过它们配合阴影classbShadow-数字,可以生成不同的阴影效果。

相关链接

发表评论