网页上有很多功能是通过链接方式传递参数,这种功能链接普通样式就是一个超链接 退出,如果将超链接的样式变成按钮样式,给用户的感觉会更好。
一种方法是给a标签添加display:block的样式,并添加hover样式。
<style type="text/css"> div.container { width: 600px; /*height: 200px;*/ border-bottom: 2px solid green; padding: 10px; } .container a,.container a:link,.container a:visited { display: block; float: left; margin-right: 5px; background: #ED2B34; padding: 5px; text-decoration: none; font-size: 12px; font-family: ‘宋体‘; color:#fff; } .container a:hover { display: block; float: left; margin-right: 5px; background: #C30A13; padding: 5px; text-decoration: none; font-size: 12px; font-family: ‘宋体‘; color:#ccc; } .clear { clear: both } </style> <div class=‘container‘> <p>微信公众平台开发(2)扫描二维码添加公众账号</p> <a href="http://www.cnblogs.com/birdskyws/p/3912719.html">跳转链接1</a><a href="http://www.cnblogs.com/birdskyws/p/3910493.html">跳转链接2</a> <div class="clear"></div> </div>
普通样式:
hover样式:
<a>按钮样式
时间: 2024-11-08 17:25:30