Question

我想隐藏标签中除图像之外的所有内容。

.payment_method_vipps label :not(img){
	display: none!important;
}

<li class="wc_payment_method payment_method_vipps">
<input id="payment_method_vipps" type="radio" class="input-radio" name="payment_method" value="vipps" data-order_button_text="Betal med Vipps">
	<label for="payment_method_vipps">
			vipps
		<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/d5/CSS3_logo_and_wordmark.svg/1200px-CSS3_logo_and_wordmark.svg.png" alt="Vipps" style="width: 100px; height: auto;">
	</label>
<div class="payment_box payment_method_vipps" style="display: block;">
</div>
</li>

我已经尝试使用:not选择器，但是它隐藏了所有内容或什么都没有。感谢您的时间和帮助。

Answer 1

此选项有点棘手，但可以使用

label[for=payment_method_vipps] {font-size:0;}

Answer 2

由于img是label[for="payment_method_vipps"]的子级，因此所有隐藏标签的内容也会隐藏其内容（即图像）。因此，使用这种HTML结构可能无法实现。

您可以尝试将标签（文本）颜色设置为transparent的一件事：

label[for="payment_method_vipps"] {
  color: transparent;
}

<li class="wc_payment_method payment_method_vipps">
  <input id="payment_method_vipps" type="radio" class="input-radio" name="payment_method" value="vipps" data-order_button_text="Betal med Vipps">
  <label for="payment_method_vipps">
			vipps
		<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/d5/CSS3_logo_and_wordmark.svg/1200px-CSS3_logo_and_wordmark.svg.png" alt="Vipps" style="width: 100px; height: auto;">
	</label>
  <div class="payment_box payment_method_vipps" style="display: block;">
  </div>
</li>

如果由于某些原因无法解决问题，则必须将文本（“ vipps”）包装到span中，然后将display: none应用于该文本。

Answer 3

您可以这样做。首先隐藏标签及其所有内容。然后将图像的visibility设置为visible。将img放在label标记内可能不是最佳实践。您可以将文本嵌套到span标记中。

.payment_method_vipps label{
    visibility: hidden;
}

.payment_method_vipps label img{
    visibility: visible;
}

<li class="wc_payment_method payment_method_vipps">
<input id="payment_method_vipps" type="radio" class="input-radio" name="payment_method" value="vipps" data-order_button_text="Betal med Vipps">
	<label for="payment_method_vipps">
			vipps
		<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/d5/CSS3_logo_and_wordmark.svg/1200px-CSS3_logo_and_wordmark.svg.png" alt="Vipps" style="width: 100px; height: auto;">
	</label>
<div class="payment_box payment_method_vipps" style="display: block;">
</div>
</li>

隐藏标签中的所有内容，除了img

我想隐藏标签中除图像之外的所有内容。

3 个答案: