码迷,mamicode.com
首页 > 其他好文 > 详细

box-shadow学习

时间:2015-11-26 13:06:24      阅读:149      评论:0      收藏:0      [点我收藏+]

标签:

1、语法

box-shadow: h-shadow v-shadow blur spread color inset;

技术分享

 1 <!doctype html>
 2 <html>
 3 <head>
 4 <title>shape of css</title>
 5 <style>
 6 .moon{width:80px;height:80px;box-shadow:100px 2px red;border-radius:50%;background-color:#0fc;}
 7 </style>
 8 </head>
 9 <body>
10 <div class="moon"></div>
11 </body>
12 </html>

蓝色的是元素框,红色的是阴影,可以看出box-shadow只是把原来的元素克隆一下而已,再加上其他修饰,生成阴影效果

box-shadow学习

标签:

原文地址:http://www.cnblogs.com/ward/p/4997298.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!