html+checkbox+必填,HTML的checkbox和radio的美化

对于checkbox必填的情况，可以通过以下方式实现：

1. 使用HTML5的required属性

在checkbox的标签中添加required属性，如下所示：

<input type="checkbox" name="hobby" value="reading" required> 阅读

这样当用户提交表单时，如果该checkbox没有被选择，则会弹出提示要求用户选择。

2. 使用JavaScript验证

在表单提交时，使用JavaScript判断checkbox是否被选中，如果没有选中则弹出提示框，要求用户选择。具体实现方式如下：

function validateForm() {
  var checkBox = document.getElementById("hobby");
  if (checkBox.checked == false){
    alert("请选择爱好！");
    return false;
  }
}

在form标签中添加onsubmit事件，调用validateForm()函数：

<form onsubmit="return validateForm()">
  <input type="checkbox" id="hobby" name="hobby" value="reading"> 阅读
  <input type="submit" value="提交">
</form>

对于checkbox和radio的美化，可以使用CSS样式来实现。具体实现方式可以参考以下链接：

1. https://www.w3cplus.com/css3/beautiful-checkboxes-and-radio-buttons-with-pure-css.html

2. https://www.cssscript.com/pure-css-radio-checkbox-replacement/