Question

基本上这是一项调查，答案从1到10.当有人点击某个数字时，我希望我的标签背景能够改变颜色。我使用了radiobuttons，因为他们只能选择1个答案。

<label class="lfirst">
    <input type="radio" name="answer1" value="1">       
    1
</label>

<label>
    <input type="radio" name="answer1" value="2">       
    2
</label>


<style>
input[type="radio"]{
   display: none;
}
.answers label {
  display: inline-block;
  font-weight: bold;
  margin: 0 3px 0 0;
  padding: 4px 12px;
  cursor: pointer;
  background: orange;
}

.answers label + input[type="radio"]:checked{
  background: red;  
}
</style>

Answer 1

您可以获得单选按钮的宽度和高度，将其包装在具有该宽度和高度的div中，并将背景颜色应用于它。这样当你隐藏单选按钮时，div仍然会有相同的宽度和高度以及你选择的背景颜色。

（隐藏的）radiobutton的样式标签

1 个答案: