使用css设置div块实现阴影呈现3d效果

       最近闲来无聊，突然想着，自己在项目中，有的时候会需要一些稍微炫酷点的界面实现，然后当时也都是为了把效果实现，然后也没有认真的去研究学习，所以很多时候都是这个任务完成了，也就完成了。没有把相应的知识点给认真研究学习和巩固。

       前几天项目中用到的一个就是要实现界面的某个模块呈现阴影，这样给人有种3d的感觉，然后当时主要用到的点其实就一个：box-shadow，这个css的属性，也是自己第一次用到的，当时因为自己懒也就没有认真学习了。现在就把该点好好记录下来。

       box-shadow:

            属性说明：它可以设置一个或者多个下拉阴影的框

            语法：box-shadow:h-shadow v-shadow blur spread color inset

            注意：该属性把一个或者多个下拉阴影添加到框上，该属性是一个用逗号分隔阴影的列表，每个阴影由2-4个长度值，一个可选的颜色值和一个可选的inset关键字来规定。

            属性值参数说明：

                     h-shadow:必需的，水平阴影的位置，允许为负值

                     v-shadow:必需的，垂直阴影的位置，允许为负值

                     blur:可选，模糊距离

                     spread:可选，阴影的大小

                     color:可选，阴影的颜色

                     inset:可选，从外层的阴影（开始时）改变阴影内侧阴影

 

 

 

如上图所示：即用了box-shadow了。源码为：

    box-shadow:red 0px 0px 10px

 

 好了，今天暂时先写到这了。方便以后自己获取其他有类似需求的人用到