CSS3新特性box-shadow阴影效果、圆角border-radius效果实现
使用CSS3 border-radius属性，你可以给任何元素制作 圆角 ，border-radius属性，可以使用以下规则：
（1）四个值：第一个值为左上角，第二个值为右上角，第三个值为右下角，第四个值为左下角
（2）三个值：第一个值为左上角，第二个值为右上角和左下角，第三个值为右下角
（3）两个值：第一个值为左上角与右下角，第二个值为右上角与左下角
（4）一个值：四个圆角值相同
如果想要图形变为圆角效果，只需要添加一个属性就行了，border-radius 这个属性。如果想圆的厉害那幺这个值就变大一些。
!DOCTYPE html html head meta charset="UTF-8" title 首页 /title style div{ width: 100px; height: 100px; background-color: rgb(151, 26, 49); border-radius: 10px; } img{ width: 100px; height: 100px; border-radius: 10px; } /style /head body div img src="../vue/1.jpg" /div /body /html
如果想要变为圆形，那幺就写100%就行了。
box-shadow 阴影效果
margin: 0 auto：上下不需要管，auto是让左右的空间平均分配，然后让盒子在中间，这就是居中。让左右空间的间隙平均分配就是auto的作用。
0代表水平方向没有阴影，第二个0代表垂直方向没有阴影，第三个是阴影的模糊度。
!DOCTYPE html html head meta charset="UTF-8" title 首页 /title link href="" type="text/css" rel="stylesheet"/ style type="text/css" div{ width: 500px; height: 500px; background-color: greenyellow; margin: 0 auto; box-shadow: 0 0 50px rgba(0, 0, 0, 0.5); } /style /head body div class="d1" /div /body /html
CSS3新特性box-shadow阴影效果、圆角border-radius效果实现
