Question

我想在不使用javascript的情况下在CSS中构建一个简单的测验，我已编写此代码，但请告诉我如何在不使用javascript的情况下在单选按钮上应用动作侦听器？如果选择了正确的选项，那么消息＆＃34;正确＆＃34;应该打印出来。

<!DOCTYPE html>
<html>
 <head>
  <title>Quiz</title>
 </head>
 <body>
  <h3>Capital of USA is?</h3>
  <input type="radio" value="opt1" name="capital">New York<br>
  <input type="radio" value="opt2" name="capital">Washington<br>
 </body>
</html>

Answer 1

你可以使用一点黑客

注意：这可能不是一个好的解决方案，这是css可以做的最好的

label {
  display: none;
}
input:checked +br+ label {
  display: block;
}

 <h3>Capital of USA is?</h3>
<input type="radio" value="opt1" name="capital">New York
<br>
<label>Wrong answer</label>
<input type="radio" value="opt2" name="capital">Washington
<br>
<label>Right answer</label>

CSS中的响应单选按钮

1 个答案: