如何使html链接看起来像一个按钮？ [英] How do I make an html link look like a button?

问题描述

我使用ASP.NET，我的一些按钮只是做重定向。我宁愿他们是普通的链接，但我不希望我的用户注意到外观上有很大的不同。我考虑了用锚点（即标签）包装的图片，但我不想在每次更改按钮上的文本时启动图片编辑器。

解决方案

将此类应用到它

 。 button {font：bold 11px Arial; text-decoration：none; background-color：#EEEEEE;颜色：＃333333; padding：2px 6px 2px 6px; border-top：1px solid #CCCCCC; border-right：1px solid＃333333; border-bottom：1px solid＃333333; border-left：1px solid #CCCCCC;}  

  a href =＃class =button>示例< / a>  

I'm using ASP.NET, some of my buttons just do redirects. I'd rather they were ordinary links, but I don't want my users to notice much difference in the appearance. I considered images wrapped by anchors, i.e. tags, but I don't want to have to fire up an image editor every time I change the text on a button.

解决方案

Apply this class to it

.button {
  font: bold 11px Arial;
  text-decoration: none;
  background-color: #EEEEEE;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
}

<a href="#" class="button">Example</a>

这篇关于如何使html链接看起来像一个按钮？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！