<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>制作漂亮的圆角按钮<title>
<style type="text/css">
.loginBtnDiv
{
float:right;
padding-right:50px;
padding-top:10px;
}
.loginBtn, .ResgiterBtn{
display:-webkit-box;
padding:8px 30px;
font-size:16px;
border-style:none;
color:#FFFFFF;
background-color:#FF6600;
border:1px #FF6600 solid;
line-height:24px;
/*设置鼠标移动到按钮上编变成小手*/
cursor:pointer;
/*设置按钮的内发光效果*/
-webkit-box-shadow:inset 0px 0px 5px #fff;
-moz-box-shadow:inset 0px 0px 5px #fff;
box-shadow:inset 0px 0px 5px #fff;
/*设置按钮为圆角*/
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius:8px;
}
.ResgiterBtn
{
background-color:#0066FF;
border:1px #0066FF solid;
}
</style>
</head>
<body>
<div class="loginDiv">
<button class="loginBtn">登陆</button>
<button class="ResgiterBtn">注册</button>
</div>
</body>
</html>
效果如下：
