以下讨论的是和CSS3 尖角 相关的一款CSS3制作的带尖角的按钮实例代码教程文章,内容是本站精心挑选整理的教程,希望对广大的网友给到帮助,下面是详细内容:一个按钮CSS3 返回按钮,带尖角效果,简单的实例演示点击下面运行代码可以查看效果!...
以下讨论的是和CSS3尖角相关的一款CSS3制作的带尖角的按钮实例代码教程文章,内容是本站精心挑选整理的教程,希望对广大的网友给到帮助,下面是详细内容。一个按钮CSS3 返回按钮,带尖角效果,简单的实例!
<style>
.kele:before
{
position: absolute; content: " ";
border: transparent 14px solid; border-width: 13px 8px ;
border-right-color: #CCC;
margin: 1px -16px 0 0;
}
.kele
{
position: relative; width: 40px;
height: 28px; background: #EEE;
border-radius: 5px;
margin: 30px;
text-align: center;
line-height: 28px;
color: #999;
font-size: 14px;
border: 1px solid #CCC;
}
.kele:after
{
position: absolute; content: " ";
border: transparent 13px solid;
border-width: 12px 8px;
border-right-color: #EEE;
margin: 2px -15px 0 0;
top: 2px;
}
</style>
<div class="kele">
<a href="#">返回</a>
</div>阅读全文