Question

您好，我正在尝试更改在线调查中单选按钮上的标签。 CSS的新手，最近几周已经解决了一些问题，但是无法解决，

我已经尝试过使用内容和显示方式进行一系列操作（无用），例如

ALTER TABLE PKweight DROP INDEX id

和

#question-2 label:nth-child(5) {
content: "Y";
}

以下是从调查中获得的信息，我希望这足以为您提供指导，我只能上传CSS

label , #button-rating-2-5 {
content: "Y";
}

只需尝试以下操作，它就会在标签中插入“ y”

<label title="4" for="button-rating-2-5">
    4
    <input id="button-rating-2-5" type="radio" name="question-2" value="5" style="">
</label>

但是，如果我使用以下任何标签，则“ AND”按钮将被删除，而不仅仅是标签。

#question-2 label:nth-child(5):before {
content: "Y";
font-size: 14px; 
}

因此，换句话说，我只想更改此问题的默认“ 4”以显示“ Y”。感谢任何帮助。谢谢。

Answer 1

尝试一下...

#changeLabel{ font-size: 0; }
#changeLabel:before { content: "Y"; font-size: 14px; }

<label title="4" for="button-rating-2-5" id="changeLabel">
    4
    <input id="button-rating-2-5" type="radio" name="question-2" value="5" style="">
</label>

Answer 2

您可以为元素设置visibility选项。下面的示例：

/* You can use label[for="button-rating-2-5"]{} selector too */
label[title="4"] {
  visibility: hidden;
  font-size: 0 /* no space between :before and input */
}

label[title="4"]:before {
  content: "Y";
  visibility: visible;
  font-size: 14pt /* add new font-size for Y */
}

label[title="4"]>input {
  visibility: visible /* child element input's visibility */
}

<label title="4" for="button-rating-2-5">
    4
    <input id="button-rating-2-5" type="radio" name="question-2" value="5" style="">
</label>

CSS更改单选按钮标签

2 个答案: