Follow along with the video below to see how to install our site as a web app on your home screen.
Anmerkung: This feature may not be available in some browsers.
Okay, das verstehe ich ja. Nur wüsste ich dann natürlich gerne, welcher CSS-Eintrag dasselbe layout herstellt, das ich bisher per Table & Co. konstruiert habe. Simples Layout-Beispiel, siehe hier (oben!).Das hat nichts mit "in" zu tun, sondern mit sachlicher korrekter Anwendung.
Früher wurde das table-Element ähnlich wie die float-Anweidung auch zum Layouten mißbraucht. Da es keine anderen besseren Möglichkeiten gab war das soweit auch in Ordnung.
Mit HTML5 haben alle HTML-Elememente eine Bedeutung bekommen. Deshalb darf nach den aktuellen HTML-Regeln kein HTML-Element zur Gestaltung / zum Layout verwendet werden. Das Layout geschieht einzig über CSS.
<!DOCTYPE html>
<html lang="de">
<head>
</head>
<body>
<nav>
</nav>
<main>
</main>
<footer>
</footer>
</body>
</html>
Nun gut - ich lerne gerade mit Hilfe des Buches HTML+CSS von Peter Müller, wg. der Grundlagen. Aber meine ursprüngliche Frage ist hier bisher nicht beantwortet worden - wo und wie in einer CSS werden Table usw. ersetzt.Du solltest zunächst die HTML-Grundlagen lernen. Mit einem layoutbaren Quelltext hat das nichts zu tun.
Hm.....nun.....es könnte mir ja jemand sagen wie anhand dieser oberen Leiste das HTML korrekt aussehen müsste und wie der CSS-Teil dazu wäre. Oder ist das Forum hier nichs für Anfänger oder Autodidakten oder überhaupt Neulinge?Noch mal deutlich: Es gibt keinen "Eins-zu-Eins" Ersatz. Erst korrektes HTML, dann die Gestaltung mit CSS.
Ich habe nun also angefangen, mich mit Grid zu beschäftigen. Im Internet habe ich aber bisher keine so tolle Seite gefunden, die das umfangreich (!) erklärt. Vieleicht hat hier jemand einen Tipp? Ansonsten: Wird bei Grid keine CSS mehr verwendet?D. h. Du müsstest dich dort auch mit Flex und Grid vertraut machen können.
Allein diese Frage sagt aus, dass du dich mit dem Thema nicht wirklich auseinander gesetzt hast.Wird bei Grid keine CSS mehr verwendet?
css grid
Allein diese Frage sagt aus, dass du dich mit dem Thema nicht wirklich auseinander gesetzt hast.
Meine Frage ging in die Richtung: sind hier sozusagen CSS und HTML in einer Datei, oder benutzt HTML einen link, um CSS einzubinden?Doch, Grid ist CSS, es stellt nur neue Regeln bereit, die es früher in CSS noch nicht gab.
Gibts eventuell auch ein gutes Buch zum Thema?Ich empfehle entweder Selfhtml:
Das ist vollkommen unabhängig davon ob Du Grid, Flex oder etwas anderes benutzt. Wie man CSS einbindet, kannst Du auch bei Selfhtml nachlesen:
Das Buch, das du da erwähnst, habe ich ja inzwischen von vorne bis hinten durch. Grid kommt darin aber fast nur am Rande vor, und auch nicht so penibel genau, wie beim HTML und CSS-Thema vorher im Buch.Mit Büchern bin ich jetzt weniger vertraut aber Du hast ja schon eines und nach dem, was ich in Posting #10 zitiert habe, wird dort Flex und Grid ja behandelt. Versuche doch zunächst Mal, dort nachzulesen.
Aber hier ist das doch in der HTML-Datei mit drinnen:Das ist genau wie früher, bei Grid hast Du die selben Möglichkeiten, das CSS zu notieren oder auszulagern.
<!DOCTYPE html>
<html>
<head>
<style>
body {
background: none;
}
</style>
<meta charset="utf-8" />
<style>
html {
background-image: url(../Bilder/neons.jpg);
}
.grid-container {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
grid-gap: 1px;
justify-items: center;
align-items: center;
}
Aha! <nav> und <footer> geht also auch. Ich will das so wie in meiner alten Website:PS: Du kannst die drei Container schon sehr gut auseinander halten, wenn Du semantische Tag verwendest, also<nav>
für den oberen,<main>
für den mittleren und<footer>
für den unteren.
....verstehe.....das hilft mir weiter! Danke!!!Schon, das muss aber nicht so sein, Du kannst es genau so gut heraus lösen und in eine externe Datei legen.
Und da komme ich einfach nicht weiter. Die oberen "Kästen" kriege ich z.B. nicht ohne Zwischenraum hin. Den Text in der Mitte auch nicht ohne Grid.....muss wohl noch viel üben!Du willst die Elemente ja nur untereinander anordnen und dazu brauchst Du weder eine Tabelle noch unbedingt Grid oder Flex.