html - 不显示元素标签，而是以嵌套的html形式显示元素

Question

在 php 生成的站点上，我有 HTML 源代码，如

<label for="fieldName">
     Label Text
    <input id="fieldName" class="textField" (...) name="fieldName"></input>
</label>

我的问题是我想设置 display: none对于标签文本，但仍应显示输入字段。只有 CSS 可用，我无法更改 HTML 结构。

我尝试设置 display: none对于标签节点，然后是 display: block !important对于输入字段，但这没有用。我也不能引用文本本身，因为它不包含在 <p> 中或类似的东西。我找到的唯一解决方案是关于使用 for: 的标签节点属性，但输入节点未包含在标签节点内。

Answer 1

据我所知，没有办法使 display:none 的子元素可见...因此您可以尝试使用 visibility 属性...缺点是，隐藏元素的宽度保持不变.. 因此，它使输入重叠。

希望这有助于作为一个起点!

label {
  visibility: hidden;
}
input {
  left: 0;
  visibility: visible;
  position: absolute;
}

<label for="simpleQuery">
  Label Text
  <input id="simpleQuery" class="textField" (...) name="simpleQuery"></input>
</label>