如何使这个 Asp.net 按钮与这个 <button> 具有相同的 CSS？答案

【问题标题】：How can I make this Asp.net button have the same CSS as this <button>?如何使这个 Asp.net 按钮与这个 <button> 具有相同的 CSS？
【发布时间】：2014-10-17 19:34:20
【问题描述】：

我是 Asp.net 网络表单的新手，还在学习 CSS。我正在制作一个使用我购买的 html 模板的网站。

我的问题是模板使用标签，但我需要使用 Asp.net 按钮控件。我尝试将 css 类放入按钮控件的 CSSClass 属性中，但显示不正确。

您可以在此处查看示例：[链接已删除，因为页面正在被删除]

绿色的“发送密码”按钮是，我希望另一个“发送密码”按钮（即 .net 控件）的样式相同。

我环顾四周，只找到与覆盖标签呈现方式相关的答案，而我现在不想这样做。有没有简单的方法让 CSS 看起来一样？

感谢您的帮助！

【问题讨论】：

您几乎看不到绿色密码按钮。你真的希望它被这样设计吗？
@mason 是的，因为它只是一个测试页面，这不是我在部署中实际使用的。我主要只是想知道怎么做

标签： css asp.net

【解决方案1】：

在您的 asp:Button 标记声明中将 btn btn-default btn-clean 更改为 btn btn-success btn-clean。在CssClass 或css 属性中。

【讨论】：

谢谢，我没注意到！我应用了该更改，但是按钮仍然更宽，填充了它所在的 div，因为我正在复制的按钮与文本更紧密。知道我需要改变什么才能产生这种效果吗？
@Cineno28 这可能是由于它周围的 div 包装器。如果你颠倒按钮的顺序，我敢打赌按钮会交换位置和大小。所以你可能应该改变div。我注意到其中一个应用了模态类，尽管它显然不是模态弹出窗口。
我看到模板样式表有一个用于输入类型的属性，它使宽度为 100%，并且因为它没有呈现为

【解决方案2】：

.btn-success 类应用绿色样式：

.btn.btn-success.btn-clean {
    border-color: #59AD2F;
    background: transparent;
    color: #59AD2F;
}

但是您的 ASP.NET 按钮正在使用 .btn-default 类。将其设置为.btn-success（可能在CssClass="" 属性中）

【讨论】：

【解决方案3】：

解决此问题的最简单方法是将您购买的模板中的 css 复制并粘贴到您的 WebForms 应用程序的 Site.css 文件中。

例如，复制（来自@LcSalazar 的回答）...

.btn.btn-success.btn-clean {
    border-color: #59AD2F;
    background: transparent;
    color: #59AD2F;
}

... 进入 Site.css。 btn btn-success btn-clean 应该作为一个选项出现在按钮属性 CssClass 下拉列表中。

不是完成您想要的最干净的方式，但绝对是最快的方式，同时仍然使用属性视图。如果您对创建更整洁的解决方案感兴趣，可以在here 找到更多信息，从“创建和使用样式表”开始。

【讨论】：

【解决方案4】：

您可以在其他按钮（白色）中设置与绿色按钮相同的类，即.btn btn-success btn-clean：

<input type="submit" name="btnSendPasswordNew" value="Send Password" id="btnSendPasswordNew" class="btn btn-success btn-clean">

【讨论】：