圆形的画法: 先画一个矩形,然后添加 border-radius属性,设置值为正方形的一半。
#content{
width: 200px;
height: 200px;
border-radius: 100px;
box-shadow:20px 20px 30px gray;
background-color: pink;
position: relative;
left: 100px;
top:100px;
}
添加阴影: 添加box-shadow属性,参数依次为水平阴影范围(正数为右边),垂直阴影范围(正数为下边),模糊程度(数值越小越模糊),阴影颜色。
#content{
width: 200px;
height: 200px;
border-radius: 100px;
box-shadow:20px 20px 30px gray;
background-color: pink;
position: relative;
left: 100px;
top:100px;
}