Question

我正在为VB.net应用程序使用“重置密码”功能，管理员用户可以在忘记密码后为该用户重置密码。

该功能当前正常运行，但是，我现在想在用户帐户锁定时禁用此“重置密码”按钮-因为管理员必须先解锁帐户，然后才能重置密码，因此请禁用“重置密码” “按钮会向他们显示一个视觉提示，提示您需要先解锁帐户，然后才能重置密码。

有一个CSS类，称为“重置密码”按钮的按钮类型，称为mainsubmit，我想从该类继承来为“禁用的重置密码”按钮创建一个。 / p>

CSS当前为：

.mainsubmit {
    padding: 6px;
    font-size: 2.4em;
    width: 100%;
}

在此下方，我添加了：

.mainsubmit .disabledpasswordresetbutton {
    pointer-events: none;
    opacity: 0.5;
}

在VB中，我有：

If lockedOutUser.IsLockedOut Then
    btnResetPassword.Enabled = False
    btnResetPassword.CssClass = "mainsubmit.disabledpasswordresetbutton"
End If

但是，当我现在在浏览器中查看该应用程序时，如果该用户的帐户已被锁定，则“重置密码”按钮将正确显示为灰色，但它似乎没有继承{{1 }} CSS类-由于某种原因，它比该页面上还显示的其他mainsubmit按钮要小得多。

为什么属于mainsubmit的按钮没有继承.mainsubmit .disabledpasswordresetbutton CSS类的大小和其他属性？

Answer 1

我不确定，但听起来您的选择器不匹配。尝试：

.mainsubmit.disabledpasswordresetbutton {
    pointer-events: none;
    opacity: 0.5;
}

Answer 2

正如我在评论中所说：CSS选择器（.mainsubmit .disabledpasswordresetbutton）中的空格使其与类disabledpasswordresetbutton的所有元素相匹配，这些元素是类{strong>的子元素 {1}}。也许那不是您想要的。如果您删除该空间，它将匹配所有带有两个类的元素（就像在您的VB代码中一样）：

mainsubmit

.mainsubmit {
  padding: 6px;
  font-size: 2.4em;
  width: 100%;
}

.mainsubmit.disabledpasswordresetbutton {
  pointer-events: none;
  opacity: 0.5;
}

编辑：此外，正如@MrLister在评论中指出的那样，用于通过<button type="button" class="mainsubmit">Enabled</button> <button type="button" class="mainsubmit disabledpasswordresetbutton">Disabled</button>属性添加多个类的HTML表示法是用空格分隔的类名。您只能在CSS选择器中使用class。

CSS类似乎无法正确继承/覆盖属性

2 个答案: