HTML Tutorial

HTML-tagg: <fieldset>

Användning av <fieldset>:

  • Grupperar relaterade formulärkontroller (t.ex. kryssrutor, radioknappar)
  • Ger en visuell avgränsning för kontrollerna

Attribut hos <fieldset>:

  • disabled: Inaktiverar kontrollerna i fältuppsättningen
  • form: Anger formuläret som fältuppsättningen tillhör
  • name: Namnger fältuppsättningen för referensändamål

Exempel med <fieldset>:

<form>
  <fieldset>
    <legend>Personuppgifter</legend>
    <label for="namn">Namn:</label>
    <input id="namn" type="text" required>

    <label for="epost">E-post:</label>
    <input id="epost" type="email" required>
  </fieldset>

  <input type="submit" value="Skicka">
</form>

Utforska <fieldset>-taggen:

  1. Skapa ett HTML-dokument och spara det som .html.
  2. Infoga följande kod:
<!DOCTYPE html>
<html lang="sv">
<head>
  <title>Fältuppsättning</title>
</head>
<body>
  <h1>Fältuppsättning</h1>

  <form>
    <fieldset>
      <legend>Mina favoriter</legend>
      <input type="checkbox" id="pizza">
      <label for="pizza">Pizza</label>

      <input type="checkbox" id="pasta">
      <label for="pasta">Pasta</label>

      <input type="checkbox" id="tacos">
      <label for="tacos">Tacos</label>
    </fieldset>

    <input type="submit" value="Skicka">
  </form>
</body>
</html>
  1. Öppna filen i en webbläsare för att se resultatet.
  2. Experimentera med attributen och skapa olika fältuppsättningar.