border、box-shadow的使用
<!DOCTYPE html>
<html>
<head>
<title>圆柱状</title>
<style type="text/css">
*{
margin:0;padding:0;
}
li{
list-style: none;
padding:5px;
}
.shadow{
background-color: #fff;
width: 100px;
margin:50px auto;
text-align: center;
box-shadow: 0 20px 20px #ed4040 inset;
cursor:pointer;
border:1px solid #ccc;
border-radius:5px;
}
</style>
</head>
<body>
<div class="shadow">
<ul>
<li>导航</li>
</ul>
<span></span>
</div>
</body>
</html>