Hallo
Ich möchte meine Website nochmal von Grund auf neu aufbauen. Das Layout möchte ich gerne per CSS Grid machen.
Das Layout möchte ich extrem einfach halten. Nur eine Spalte mit 4 Zeilen:
- Kopf
- Navigation
- Inhalt
- Fuß
Ich habe jetzt mal den folgenden Code erstellt. Und damit ich gleich von Anfang an Fehler vermeine, möchte ich Euch fragen, ob ich das erstmal richtig gemacht habe mit dem Grundaufbau.
Mir ist natürlich auch sehr wichtig, dass es responsive ist und auch auf Smartphones gut ausschaut.
Die Rahmen habe ich erstmal nur eingebaut, um mir die "Boxen" besser vorstellen zu können.
Angucken kann man es hier: https://spaceart.de/_xxx.php
Gruß Ingo
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CSS-Grid-Layout</title>
<style>
body {
max-width: 62rem;
margin: 0rem auto 0rem auto;
border: 1px solid grey;
min-height: 100vh;
}
body>* {
border: 1px solid grey;
}
img {
max-width: 100%;
height: auto;
}
</style>
</head>
<body>
<header >
<p>KOPF</p>
</header>
<nav>
<p>NAVIGATION</p>
</nav>
<main>
<p>INHALT</p>
<img src="/_xxx-3.jpg">
</main>
<footer>
<p>FUSS</p>
</footer>
</body>
</html>Quelltext hier