Quellcode mit einem Platzierungsfehler?

1 Antwort

Vom Fragesteller als hilfreich ausgezeichnet
FrageCoding
28.11.2023, 22:46

Keine Ahnung was du willst.

So hab ich es gemacht. 

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>CatPhotoApp</title>
</head>
<body>
  <main>
    <h1>CatPhotoApp</h1>
    
    <section>
      <h2>Cat Photos</h2>
      <p>See more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a> in our gallery.</p>
      <a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
    </section>
    
    <section>
      <h2>Cat Lists</h2>
      
      <h3>Things cats love:</h3>
      <ul>
        <li>cat nip</li>
        <li>laser pointers</li>
        <li>lasagna</li>
      </ul>
      
      <figure>
        <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
        <figcaption>Cats <em>love</em> lasagna.</figcaption>
      </figure>
      
      <h3>Top 3 things cats hate:</h3>
      <ol>
        <li>flea treatment</li>
        <li>thunder</li>
        <li>other cats</li>
      </ol>
      
      <figure>
        <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
        <figcaption>Cats <strong>hate</strong> other cats.</figcaption>
      </figure>
    </section>
    <section>
      <h2>Cat Form</h2>
      <form action="https://freecatphotoapp.com/submit-cat-photo" method="post">
        <!-- Erstes fieldset -->
        <fieldset>
          <legend>Is your cat an indoor or outdoor cat?</legend>
          <label><input type="radio" name="indoor-outdoor" id="indoor" value="indoor"> Indoor</label>
          <label><input type="radio" name="outdoor-indoor" id="outdoor" value="outdoor"> Outdoor</label>
        </fieldset>
        <fieldset style="display: flex;flex-direction: column;"> 
          <!-- Direkt unter dem legend-Tag können weitere Inhalte hinzugefügt werden -->
          <legend>Additional Information</legend>
          
          <label for="catName">Cat's Name:</label>
          <input type="text" id="catName" name="catName" placeholder="Enter your cat's name" required>
          <label for="catAge">Cat's Age:</label>
          <input type="number" id="catAge" name="catAge" placeholder="Enter your cat's age" required>
          <label for="catColor">Cat's Color:</label>
          <input type="text" id="catColor" name="catColor" placeholder="Enter your cat's color" required>
          <label for="catPhotoURL">Cat's Photo URL:</label>
          <input type="text" id="catPhotoURL" name="catPhotoURL" placeholder="Enter cat photo URL" required>
          <button type="submit">Submit</button>
       
</fieldset>
      </form>
    </section>
  </main>
</body>
</html>
Woher ich das weiß:Studium / Ausbildung