尝试使用 CSS 'hide'隐藏 HTML 'label'

  • 本文关键字:hide 隐藏 HTML label CSS css
  • 更新时间 :
  • 英文 :


应该足够简单,但它似乎不起作用。

正在尝试在我的会员网站上隐藏登录表单上的复选框,上面写着"记住我"。

以下是HTML的相关部分:

<label><input name="rememberme" type="checkbox" id="rememberme" value="forever" /> Remember Me</label>

这是我的 CSS:

.rememberme {
  display: none
}

没有快乐。

知道我如何隐藏HTML的"标签"字符串吗?

谢谢

++++ 编辑 ++++

我添加了整个代码来帮助解决这个问题。再次感谢所有帮助!

<form name="mepr_loginform" id="mepr_loginform" class="mepr-form" action="https://my-site.com/login/" method="post">
    <div class="mp-form-row mepr_username">
        <div class="mp-form-label">
            <label for="log">Username</label>
        </div>
        <input type="text" name="log" id="user_login" value="" />
    </div>
    <div class="mp-form-row mepr_password">
        <div class="mp-form-label">
            <label for="pwd">Password</label>
        </div>
        <input type="password" name="pwd" id="user_pass" value="" />
    </div>
    <div class="mp-form-row mepr_math_captcha">
        <div class="mp-form-label">
            <label for="meprmath_quiz"><span id="meprmath_captcha-5cf739drre412c84"></span>*</label>
        </div>
        <input type="text" name="meprmath_quiz" id="meprmath_quiz" value="" class="mepr-form-input" />
        <input type="hidden" name="meprmath_data" value="sdasDDDDI4YWYxYmIzYWIxODU=" />
            <script>Removed b/c not important to this question</script>
    </div>
    <div>
        <label><input name="rememberme" type="checkbox" id="rememberme" value="forever" />Remember Me</label>
    </div>
    <div class="mp-spacer">&nbsp;</div>
    <div class="submit">
        <input type="submit" name="wp-submit" id="wp-submit" class="button-primary mepr-share-button " value="Log In" />
        <input type="hidden" name="redirect_to" value="https://my-site.com/account/" />
        <input type="hidden" name="mepr_process_login_form" value="true" />
        <input type="hidden" name="mepr_is_login_page" value="true" />
    </div>
</form>

这里的问题是,当输入的名称id 属性为"记住我"而不是类时,您正在选择.rememberme。 尝试将类"记住我"添加到输入标签中。

<label><input class="rememberme" type="checkbox" value="forever" /> remember me</label> 

我假设在这种情况下您无法编辑标记。您必须特定于CSS选择器,因此样式将仅适用于该选择器。因为此表单的所有直接子元素(但您要隐藏的子元素(都有一些类,我们可以在选择器上排除它们:

#mepr_loginform > div:not(.mp-form-row):not(.submit):not(.mp-spacer) {
  display: none;
}

代码笔

最新更新