How to Create HTML Radio Button by Default Checked
In this video we will explore how to create html radio button by default checked. This is basic video helping people who start out with HTML to learn how to create radio button grouped together and set a value checked by default.
A radio button group is a group of radio buttons that are connected. Only one option can be selected with a radio button. By grouping them it understands which radio button is part of the group. And forcing a selected option by default.
Code of HTML Radio Button Default Checked
Below you can find the code snippet of the HTML Radio Button by Default Checked.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>How to Create HTML Radio Button by Default Checked</title>
<style>
* {
margin: 0;
padding: 0;
font-family: sans-serif;
}
.chartMenu {
width: 100vw;
height: 40px;
background: #1A1A1A;
color: rgba(255, 26, 104, 1);
}
.chartMenu p {
padding: 10px;
font-size: 20px;
}
.chartCard {
width: 100vw;
height: calc(100vh - 40px);
background: rgba(255, 26, 104, 0.2);
display: flex;
align-items: center;
justify-content: center;
}
.chartBox {
width: 700px;
padding: 20px;
border-radius: 20px;
border: solid 3px rgba(255, 26, 104, 1);
background: white;
height: 200px;
}
</style>
</head>
<body>
<div class="chartMenu">
<p>WWW.CHARTJS3.COM | How to Create HTML Radio Button by Default Checked</p>
</div>
<div class="chartCard">
<div class="chartBox">
<form>
<label>
<input type="radio" name="radio-group" value="1"> Yes
</label>
<br>
<label>
<input type="radio" name="radio-group" value="0" checked> No
</label>
</form>
</div>
</div>
</body>
</html>
English (United States) 
Spanish