当初学习前端的时候，属于快速入门那种，没有好好深入学习html和css。如今，在空闲时间重新拿起基础书学习，都会写到一些新的知识。
1、css实现圆角、渐变功能。使用border-radius以及linear-gradient属性。
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
a{
height: 40px;
line-height: 40px;
color:#fff;
text-decoration: none;
background-repeat: repeat-x;
display: inline-block;
margin: 20px;
padding: 20px;
border-top-left-radius: 50%;
border-top-right-radius: 50%;
background-color: #42c264;
background-image: -webkit-linear-gradient(#4fec50,#42c264);
background-image: -moz-linear-gradient(#4fec50,#42c264);
background-image: -o-linear-gradient(#4fec50,#42c264);
background-image: -ms-linear-gradient(#4fec50,#42c264);
background-image: linear-gradient(#4fec50,#42c264);
}
</style>
<title>日常练习</title>
</head>
<body>
<a href="#">Box Title</a>
</body>
</html>
<script type="text/javascript"></script>