使用box-shadow属性来实现复古按钮的样式
具体代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<style>
.button {
outline: none;
width: 245px;
height: 85px;
font-size: 40px;
color: #fff;
background: #dcc551;
border-radius: 25px;
cursor: pointer;
text-align: center;
box-shadow: inset -5px 0px 3px #a9973e,
inset 5px 0px 3px #a9973e,
inset 0px 5px 3px #eee3ac,
inset 0px -5px 3px #6e6228;
}
</style>
<body>
<button class="button"></button>
</body>
</html>实现的效果：
这里有明显的1px的边框但为了实现点击的效果不能给去掉。
还需要大牛来指点一下。
5397
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
