Beispiel:HTML input-Element9.html
Aus SELFHTML-Wiki
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8">
<style>
fieldset {
border: none;
padding-bottom: 5em;
}
input {
margin-right: 1em;
}
label::after {
content: "";
display: block;
}
body {
background-image: linear-gradient(135deg, red 20%, white 25%, white 75%, green 79%);
background-repeat: no-repeat;
height: 100vh;
margin: 0;
}
h1,
form {
width: 20em;
margin: 0 auto;
}
h1 {
padding: 5em 0 1em;
text-align:center;
}
</style>
<title>Checkboxen definieren</title>
</head>
<body>
<h1>Pizzabelag nach Wahl!</h1>
<form>
<fieldset>
<legend>Kreuzen Sie die gewünschten Zutaten an:</legend>
<input type="checkbox" name="zutat" value="kaese" id="check1" checked><label for="check1">Käse</label>
<input type="checkbox" name="zutat" value="schinken" id="check2"><label for="check2">Schinken</label>
<input type="checkbox" name="zutat" value="salami" id="check3"><label for="check3">Salami</label>
<input type="checkbox" name="zutat" value="oliven" id="check4"><label for="check4">Oliven</label>
<input type="checkbox" name="zutat" value="paprika" id="check5"><label for="check5">Paprika</label>
<input type="checkbox" name="zutat" value="pilze" id="check6"><label for="check6">Pilze</label>
</fieldset>
</form>
</body>
</html>
