82 lines
2.1 KiB
HTML
82 lines
2.1 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Meine Rennrad Website</title>
|
||
<link rel="stylesheet" href="styles.css">
|
||
</head>
|
||
|
||
<body>
|
||
|
||
<header>
|
||
<h1>Rennräder</h1>
|
||
<nav>
|
||
<ul>
|
||
<li><a href="#">Startseite</a></li>
|
||
<li><a href="#">Modelle</a></li>
|
||
<li><a href="#">Tipps</a></li>
|
||
<li><a href="#">Kontakt</a></li>
|
||
</ul>
|
||
</nav>
|
||
</header>
|
||
|
||
<main>
|
||
<!-- Hero Section -->
|
||
<section class="hero">
|
||
<img src="hero-bike.jpg" alt="Rennrad auf offener Straße">
|
||
<div class="overlay"></div>
|
||
<div class="content">
|
||
<h2>Erlebe die Freiheit auf zwei Rädern</h2>
|
||
<p>Alles rund ums Rennrad – Technik, Training und Inspiration.</p>
|
||
<a href="#">Mehr erfahren</a>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Willkommen -->
|
||
<section>
|
||
<h2>Willkommen</h2>
|
||
<p>Diese Website dreht sich um Rennräder, Technik und Training.</p>
|
||
</section>
|
||
|
||
<!-- Marken -->
|
||
<section>
|
||
<h2>Beliebte Rennrad Marken</h2>
|
||
<ul>
|
||
<li>Specialized</li>
|
||
<li>Trek</li>
|
||
<li>Canyon</li>
|
||
<li>Bianchi</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<!-- Kachel‑Grid -->
|
||
<section class="tiles">
|
||
<div class="tile">
|
||
<img src="tile1.jpg" alt="Produkt 1">
|
||
<h3>Produkt 1</h3>
|
||
<p>Kurze Beschreibung des Produkts oder Blogbeitrags.</p>
|
||
<a href="#">Details</a>
|
||
</div>
|
||
<div class="tile">
|
||
<img src="tile2.jpg" alt="Produkt 2">
|
||
<h3>Produkt 2</h3>
|
||
<p>Kurze Beschreibung des Produkts oder Blogbeitrags.</p>
|
||
<a href="#">Details</a>
|
||
</div>
|
||
<div class="tile">
|
||
<img src="tile3.jpg" alt="Produkt 3">
|
||
<h3>Produkt 3</h3>
|
||
<p>Kurze Beschreibung des Produkts oder Blogbeitrags.</p>
|
||
<a href="#">Details</a>
|
||
</div>
|
||
<!-- weitere Kacheln nach Bedarf -->
|
||
</section>
|
||
</main>
|
||
|
||
<footer>
|
||
<p>© 2026 Rennrad Website</p>
|
||
</footer>
|
||
|
||
</body>
|
||
</html> |