Question

如何使用这种html结构隐藏Some text？

我正在尝试失败，

input, .checkbox label > input::after{
    display: none;
}

<div class="checkbox">
  <label>
    <input id="post_yes_no" name="post_yes_no" type="checkbox">Some text
    <small><small><br>*Some info</small></small>
</label>
</div>

https://jsfiddle.net/ex26btqd/2/

Answer 1

文本节点没有CSS选择器您必须使用p或span包装它，以便对其进行样式设置或者您可以尝试使用visibility代替display

label{
visibility: hidden;

}

label input, label small {
visibility: visible;
}

Answer 2

input::after的目标是::after伪元素，而不是输入之后的任何东西。

如果仅需要使用CSS隐藏它，则可以尝试以下操作： https://jsfiddle.net/ex26btqd/5/

这不会真正隐藏内容-它在那里，但是具有透明颜色。

如果您需要使用CSS定位文本，最好将其包装在<span>之类的元素中，以便CSS可以定位文本。文本节点无法定位，只能定位元素。

https://css-tricks.com/forums/topic/how-to-target-only-the-stray-text-inside-a-div/#post-202467

输入后隐藏文字

2 个答案: