asp.net 禁用按钮的 CSS

本文关键字：CSS 按钮 net asp | 更新日期: 2023-09-27 17:56:38

我有一个 asp.net 按钮，根据某些 c# 代码条件被禁用。该按钮，称为btnBefore设置为使用以下css类：

.btnBlue{
background: rgb(40, 108, 244); /* Old browsers */
background:linear-gradient(to bottom, rgb(40, 108, 244) 0%, rgb(0, 68, 204) 50%, rgb(40, 108, 244) 100%) repeat scroll 0% 0% transparent; /* W3C */
background: -moz-linear-gradient(top,  rgb(40, 108, 244) 0%, rgb(0, 68, 204) 50%, rgb(40, 108, 244) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(40, 108, 244)), color-stop(50%,rgb(0, 68, 204)), color-stop(100%,rgb(40, 108, 244))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgb(40, 108, 244) 0%,rgb(0, 68, 204) 50%,rgb(40, 108, 244) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgb(40, 108, 244) 0%,rgb(0, 68, 204) 50%,rgb(40, 108, 244) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgb(40, 108, 244) 0%,rgb(0, 68, 204) 50%,rgb(40, 108, 244) 100%); /* IE10+ */
-ms-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=rgb(40, 108, 244), endColorstr=rgb(40, 108, 244),GradientType=0 ); /* IE6-9 */}

当按钮处于禁用状态时，即 btnPrevious.disabled=true;css 属性不起作用。我哪里错了。谢谢。

编辑：只是让问题更贴近主题：

为什么或如何我的 CSS 被默认框架覆盖？

asp.net 禁用按钮的 CSS

听起来像是特异性的案例。服务器规则可以应用于同一元素。您的规则不是很具体，会尽早应用（因此很容易被覆盖）。

在一个好的浏览器中打开网页（我使用 Chrome），然后打开开发选项卡 （F12）。 Inspect按钮并查看Styles选项卡。您应该能够看到不需要的样式来自哪里（它将显示文件和应用不需要的样式的选择器/规则）。

如果您不想（或无法）跟踪（并删除）负责弄乱禁用状态的样式，您可以尝试使您的规则更加重要。检查链接的特异性，但提示是尝试通过定位按钮（而不仅仅是类）和如下所示的容器来使您的规则更具体：

#container button.btnBlue  {
  ...
}

您还可以选择使用 rebel 标志!important将您的规则置于不使用 !important 标志的其他规则之前，如下所示：

#container button.btnBlue  {
  background: rgb(40, 108, 244) !important; 
  ...
}

一般来说 - 如链接中所述 - 您应该尽量不使用!important因为它有点破坏CSS的美丽。除非asp.net按钮也使用 !important（或内联样式属性），否则制定比asp.net规则更具体的规则应该非常容易，因为只有您知道按钮在文档中的位置。您始终能够使您的规则比asp.net规则更具体一些。

我不知道不需要的样式是如何应用的 - 我只是希望它不是带有!important标志的内联（style属性;)

您可以使用:disabled到它应该工作的按钮。尝试以下 css

.btnBlue:disabled{
background: rgb(40, 108, 244); /* Old browsers */
background:linear-gradient(to bottom, rgb(40, 108, 244) 0%, rgb(0, 68, 204) 50%, rgb(40, 108, 244) 100%) repeat scroll 0% 0% transparent; /* W3C */
background: -moz-linear-gradient(top,  rgb(40, 108, 244) 0%, rgb(0, 68, 204) 50%, rgb(40, 108, 244) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(40, 108, 244)), color-stop(50%,rgb(0, 68, 204)), color-stop(100%,rgb(40, 108, 244))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgb(40, 108, 244) 0%,rgb(0, 68, 204) 50%,rgb(40, 108, 244) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgb(40, 108, 244) 0%,rgb(0, 68, 204) 50%,rgb(40, 108, 244) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgb(40, 108, 244) 0%,rgb(0, 68, 204) 50%,rgb(40, 108, 244) 100%); /* IE10+ */
-ms-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=rgb(40, 108, 244), endColorstr=rgb(40, 108, 244),GradientType=0 ); /* IE6-9 */}
相关文章：