Ausprobieren Chat

This commit is contained in:
Lara 2026-03-12 11:10:14 +01:00
parent 4b2f1f5f27
commit 0904a0aaa3

View File

@ -3,7 +3,60 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Meine Rennrad Website</title> <title>Cycle with ma</title>
<style>
body, html {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
}
header {
background: #333;
color: #fff;
padding: 1rem;
}
header nav ul {
list-style: none;
margin: 0;
padding: 0;
display: flex;
gap: 1rem;
}
header nav a {
color: #fff;
text-decoration: none;
}
.hero {
position: relative;
text-align: center;
color: #fff;
}
.hero-image {
width: 100%;
height: auto;
display: block;
object-fit: cover;
}
.hero-content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: rgba(0, 0, 0, 0.4);
padding: 2rem;
border-radius: 8px;
}
.hero-button {
display: inline-block;
margin-top: 1rem;
padding: 0.75rem 1.5rem;
background: #ff9900;
color: #333;
text-decoration: none;
border-radius: 4px;
font-weight: bold;
}
</style>
</head> </head>
<body> <body>
@ -21,6 +74,15 @@
</header> </header>
<main> <main>
<!-- Hero Section -->
<section class="hero">
<div class="hero-content">
<h2>Willkommen bei Rennrad-Glück</h2>
<p>Entdecke Technik, Training und Top-Modelle für deine nächste Fahrt.</p>
<a href="#" class="hero-button">Mehr erfahren</a>
</div>
<img src="hero-bike.jpg" alt="Rennrad auf offener Straße" class="hero-image">
</section>
<section> <section>
<h2>Willkommen</h2> <h2>Willkommen</h2>
<p>Diese Website dreht sich um Rennräder, Technik und Training.</p> <p>Diese Website dreht sich um Rennräder, Technik und Training.</p>
@ -29,6 +91,7 @@
<section> <section>
<h2>Beliebte Rennrad Marken</h2> <h2>Beliebte Rennrad Marken</h2>
<ul> <ul>
<li>Thömus</li>
<li>Specialized</li> <li>Specialized</li>
<li>Trek</li> <li>Trek</li>
<li>Canyon</li> <li>Canyon</li>