css 链接设计,css将超链接a设计成按钮样式实例

这篇文章主要为大家详细介绍了css将超链接a设计成按钮样式实例，具有一定的参考价值，感兴趣的小伙伴们可以参考一下,有需要的朋友可以收藏方便以后借鉴。

刚接到一个用户的要求，想把button样式用超链接a写出来，如下图：

上面的登陆按钮是button代码，实现代码如下：

1、button的CSS代码.btn-submit{width:100%;border:none;outline:none;height:3.07rem;margin-top:3.7rem;font-size:1.78rem;letter-spacing:1rem;background-color:#7f6173;color:#fff;}

2、HTML代码登录

下面的注册按钮是需要使用a标签的样式来实现，具体代码如下：

CSS样式代码：.btn-submit{width:100%;border:none;outline:none;height:3.07rem;margin-top:3.7rem;font-size:1.78rem;letter-spacing:1rem;background-color:#7f6173;color:#fff;}

a{font-size:1.78rem;display:block;text-decoration: none;color:#fffbackground:#c00;border-radius:3px;text-align:center;

line-height:3.07rem;}

HTML代码：注册

这样，最终的实现效果样式就是开始的图片效果。

以上就是css将超链接a设计成按钮样式实例的全部内容。

以上就是css将超链接a设计成按钮样式实例的全部内容，希望对大家的学习和解决疑问有所帮助，也希望大家多多支持361模板网。

感谢打赏，我们会为大家提供更多优质资源！