css3制作圆角并且投影的图层元素方法
border-radius属性可以制作圆角效果
border-radius属性值包括:ox-shadow: hoff voff bd sd color inset;
box-shadow属性可以制做投影效果
border-radius属性值包括:
- border-top-left-radius: 定义框的左上角。
- border-top-right-radius: 定义框的右上角。
- border-bottom-right-radius: 定义框的右下角。
- border-bottom-left-radius: 定义框的左下角。
style部分代码:
#left_top{
width:287px; height:100px; margin-top:10px; margin-left:10px; margin-right:10px;
border-color:#cccccc; border-style:solid; border-width:1px;
border-radius:5px;
box-shadow: 3px 3px 3px lightgray;
}
body部分代码:
<div id="left_top"> </div>
效果图部分: