HTML & CSS Interview Question #38

What is the difference between checkbox and radio inputs?

Forms, Validation, Metadata, Media, Responsive Images & Accessibility Junior Beginner

Quick Interview Answer

Checkboxes represent independent on/off choices and can allow multiple selections. Radio buttons represent mutually exclusive choices within a group; radio controls with the same name belong to the same selection group.

Detailed Explanation

Use checkboxes when several options may be selected and radio buttons when the user must choose one option from a small known set.

Code Example

<label>
    <input type="checkbox"
           name="skills"
           value="html">
    HTML
</label>

<label>
    <input type="radio"
           name="level"
           value="junior">
    Junior
</label>

<label>
    <input type="radio"
           name="level"
           value="senior">
    Senior
</label>