Answers:
TL; DR：required为无线电组的至少一个输入设置属性。
required所有输入的设置更加清晰，但不是必需的（除非动态生成单选按钮）。
要对单选按钮进行分组，它们必须全部具有相同的name值。这样一次只能选择一个，并应用于required整个组。
<form>
Select Gender:<br>
<label>
<input type="radio" name="gender" value="male" required>
Male
</label><br>
<label>
<input type="radio" name="gender" value="female">
Female
</label><br>
<label>
<input type="radio" name="gender" value="other">
Other
</label><br>
<input type="submit">
</form>另请注意：
为了避免对是否需要单选按钮组感到困惑，建议作者在组中的所有单选按钮上指定属性。实际上，总的来说，鼓励作者避免一开始就没有任何最初检查的控件的单选按钮组，因为这是用户无法返回的状态，因此通常被认为是较差的用户界面。
您可以使用此代码段...
<html>
<body>
<form>
<input type="radio" name="color" value="black" required />
<input type="radio" name="color" value="white" />
<input type="submit" value="Submit" />
</form>
</body>
</html>在选择语句之一中指定“ required ”关键字。如果要更改其外观的默认方式。您可以按照以下步骤。如果您打算修改默认行为，这只是为了提供更多信息。
将以下内容添加到您的.css文件中。
/* style all elements with a required attribute */
:required {
background: red;
}有关更多信息，您可以参考以下URL。
如果您的单选按钮已经过自定义，例如，单选按钮的原始图标已通过CSS隐藏，display:none那么您可以创建自己的单选按钮，则可能会收到错误消息。
修复它的方法是display:none用opacity:0
display:none。多数民众赞成在这里已经回答：stackoverflow.com/questions/49687229/…–
这是必需的单选按钮的非常基本但现代的实现，带有本地HTML5验证：
body {font-size: 15px; font-family: serif;}
input {
background: transparent;
border-radius: 0px;
border: 1px solid black;
padding: 5px;
box-shadow: none!important;
font-size: 15px; font-family: serif;
}
input[type="submit"] {padding: 5px 10px; margin-top: 5px;}
label {display: block; padding: 0 0 5px 0;}
form > div {margin-bottom: 1em; overflow: auto;}
.hidden {
opacity: 0;
position: absolute;
pointer-events: none;
}
.checkboxes label {display: block; float: left;}
input[type="radio"] + span {
display: block;
border: 1px solid black;
border-left: 0;
padding: 5px 10px;
}
label:first-child input[type="radio"] + span {border-left: 1px solid black;}
input[type="radio"]:checked + span {background: silver;}<form>
<div>
<label for="name">Name (optional)</label>
<input id="name" type="text" name="name">
</div>
<label>Gender</label>
<div class="checkboxes">
<label><input id="male" type="radio" name="gender" value="male" class="hidden" required><span>Male</span></label>
<label><input id="female" type="radio" name="gender" value="male" class="hidden" required><span>Female </span></label>
<label><input id="other" type="radio" name="gender" value="other" class="hidden" required><span>Other</span></label>
</div>
<input type="submit" value="Send" />
</form>尽管我非常支持使用原生HTML5验证的简约方法，但从长远来看，您可能希望将其替换为Javascript验证。Javascript验证使您可以更好地控制验证过程，并允许您设置真实的类（而不是伪类）来改善（有效）字段的样式。如果Javascript损坏（或缺少），则可以使用本机HTML5验证。您可以在这里找到一个示例，以及受安德鲁·科尔（Andrew Cole）启发的其他一些有关如何制作更好形式的建议。
我必须使用required="required"相同的名称和类型，才能进行验证。
input type="radio" name="userradio" id="" value="User" required="required"
input type="radio" name="userradio" id="" value="Admin"
input type="radio" name="userradio" id="" value="Guest"