您的位置:首页 > Web前端 > HTML5

3、按钮 - HTML5&CSS3.0基础部分-xyphf

2017-07-04 12:02 387 查看
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>按钮</title>
<style>
#div1{width:200px;height:50px;line-height:50px;text-align:center;
border:1px solid #000;font-size: 30px;border-radius:10px;
box-shadow: inset 0 0 10px green,0 10px #000;
transition:0.3s all ease;
position: relative;left:0;top: 0;
}
#div1:hover{box-shadow:inset 0 0 20px green,0 10px #000;}
#div1:active{box-shadow:inset 0 0 20px green,0 0 #000;top: 10px;}
</style>
</head>
<body>
<div id="div1">按钮</div>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: