Pierwsza strona w HTML

Moja pierwsza strona internetowa
Pewnego razu zając, który był bardzo dumny ze swoich szybkich nóg, biegał po łące. Nagle zauważył jeża, który powoli toczył się przez trawy. Zając zadrwił: „Ty jesteś taki powolny, jeżu! Nigdy niczego nie osiągniesz z taką prędkością”. Jeż uśmiechnął się i odparł: „Może i jestem powolny, ale jestem wytrwały. I mam coś, czego ty nie masz, zającu – jestem mądry”. Zając wyśmiał jeża, ale ten spokojnie odpowiedział: „Pokażę ci, że mądrość jest ważniejsza niż szybkość. Zbudujmy biegaczy i sprawdźmy, kto pierwszy dobiegnie do tamtego drzewa”. Zając zgodził się z uśmiechem, przekonany o swoim zwycięstwie. Jeż jednak wcześniej wykopał niewielką dziurę przy samym drzewie. Gdy zając zaczął bieg, jeż po prostu stoczył się do dziury, która znajdowała się tuż przy mecie. Zając był bardzo zdziwiony, gdy dotarł na miejsce i zobaczył, że jeż już tam jest. Morał: Nie zawsze szybkość jest najważniejsza, czasem mądrość i spryt mogą przynieść lepsze rezultaty.
- Pierwszy element
- Drugi element
- Trzeci element
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/css/styles.css">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<title>Moja strona</title>
</head>
<body>
<h3>Moja pierwsza strona internetowa</h3>
<div class="table-section">
<table style="border-collapse: collapse; margin-bottom: 20px;">
<tr>
<th style="width: 20px; height: 20px; background-color: maroon;"></th>
</tr>
<tr>
<td></td>
<td style="width: 20px; height: 20px; background-color: limegreen;"></td>
<td style="width: 20px; height: 20px; background-color: olivedrab;"></td>
<td style="width: 20px; height: 20px; background-color: teal;"></td>
<td style="width: 20px; height: 20px; background-color: turquoise;"></td>
</tr>
</table>
</div>
<!-- Link do strony głównej -->
<div class="link">
<a href="https://www.example.com" target="_blank" rel="noopener">Do strony głównej</a>
</div>
<p>Pewnego razu zając, który był bardzo dumny ze swoich szybkich nóg, biegał po łące. Nagle zauważył jeża, który
powoli toczył się przez trawy. Zając zadrwił: „Ty jesteś taki powolny, jeżu! Nigdy niczego nie osiągniesz z taką
prędkością”.
Jeż uśmiechnął się i odparł: „Może i jestem powolny, ale jestem wytrwały. I mam coś, czego ty nie masz, zającu –
jestem mądry”.
Zając wyśmiał jeża, ale ten spokojnie odpowiedział: „Pokażę ci, że mądrość jest ważniejsza niż szybkość. Zbudujmy
biegaczy i sprawdźmy, kto pierwszy dobiegnie do tamtego drzewa”.
Zając zgodził się z uśmiechem, przekonany o swoim zwycięstwie. Jeż jednak wcześniej wykopał niewielką dziurę przy
samym drzewie. Gdy zając zaczął bieg, jeż po prostu stoczył się do dziury, która znajdowała się tuż przy mecie.
Zając był bardzo zdziwiony, gdy dotarł na miejsce i zobaczył, że jeż już tam jest.
Morał: Nie zawsze szybkość jest najważniejsza, czasem mądrość i spryt mogą przynieść lepsze rezultaty.</p>
<div class="list-section">
<ol id="my-unique-ordered-list-with-specific-id">
<li>Pierwszy element</li>
<li>Drugi element</li>
<li>Trzeci element</li>
</ol>
</div>
<div class="form-section">
<form action="submit_form.php" method="post" target="_blank">
<fieldset>
<legend>Formularz kontaktowy</legend>
<div class="form-group" style="margin-bottom: 15px;">
<label for="user_role">Opcje:</label>
<select id="user_role" name="user_role">
<option value="admin">1</option>
<option value="editor">2</option>
<option value="subscriber">3</option>
</select>
</div>
<div class="form-group" style="margin-bottom: 15px;">
<label for="name">Imię:</label>
<input type="text" id="name" name="name" required>
<label for="surname">Nazwisko:</label>
<input type="text" id="surname" name="surname" required>
</div>
<div class="form-group" style="margin-bottom: 20px;">
<textarea id="message" name="message" rows="4" cols="50" required
title="Enter your message" placeholder="Enter your message here">Wiadomość</textarea>
</div>
<div style="margin-bottom: 15px;">
<input type="checkbox" id="scales" name="scales" checked />
<label for="scales">Akceptuję politykę prywatności</label>
</div>
<div class="form-group">
<input type="submit" value="Wyślij" style="margin-right: 2px;">
<input type="reset" value="Resetuj">
</div>
</fieldset>
</form>
</div>