• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

PraktikumAvatarec

Neues Mitglied
3 März 2020
7
0
1
23
Hey ,ich würde gerne mal nach einer Gesamt Html&Css Vorlage Fragen welche ungefähr die Boxen so ausrichtet wie auf dem Angehangenen Bild, die Farben spielen erstmal keine Rolle. Ich würde gerne mal eine abgespeichterte Vorlage haben an die ich mich richten kann.
Vielen Dank!
MfG Ava
html.jpg
 

PraktikumAvatarec

Neues Mitglied
3 März 2020
7
0
1
23
Hier haben wir gerade etwas ganz ähnliches entwickelt:
Hey ^^
Danke für deine so schnelle Antwort jedoch muss ich ehrlich gesagt sagen dass ich nich ganz durchblicke.
Ich brauche keinen Inhalt in den Boxen sondern einfach nur die "sichtbaren" boxen dass man sieht dass sie vorhanden sind .
Ich weiss nicht ob das ganz verständlich ist aber ich suche eigentlich nur nach einer Vorlage die Boxen erstellt und die so ausrichtet wie auf dem oben gezeigten Bild.
Sorry für die unklarheit ,ich habe heute erst nach einer langen Zeit wieder angefangen mit HTMl
MfG Ava
 

MrMurphy

Senior HTML'ler
28 Juli 2009
1.568
232
63
Das ist einfach, wird dir nur bei der Erstellung von Webseiten kaum weiterhelfen. Das Layout von Webseiten ist immer vom endgültigen Inhalt abhängig. Also zunächst den HTML-Quelltext nach den korrekten HTML-Regeln erstellen und dann das Layout erstellen.

Ein Beispiel für deinen Wunsch:

Code:
<!DOCTYPE html>
<html lang="de">
<head>
   <meta charset="utf-8">
   <title>Layout ohne Inhalt</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <style>
      body {
         margin: 0rem 0rem 0rem 0rem;
         display: flex;
         flex-wrap: wrap;
      }
      div:nth-child(1) {
         background-color: green;
         width: 100%;
         height: 25vh;
      }
      div:nth-child(2) {
         background-color: yellow;
         width: 50%;
         height: 25vh;
      }
      div:nth-child(3) {
         background-color: red;
         width: 50%;
         height: 25vh;
      }
      div:nth-child(4) {
         background-color: blue;
         width: 100%;
         height: 50vh;
      }
   </style>
</head>
<body>
   <div></div>
   <div></div>
   <div></div>
   <div></div>
</body>
</html>
 
  • Like
Reaktionen: PraktikumAvatarec

PraktikumAvatarec

Neues Mitglied
3 März 2020
7
0
1
23
Das ist einfach, wird dir nur bei der Erstellung von Webseiten kaum weiterhelfen. Das Layout von Webseiten ist immer vom endgültigen Inhalt abhängig. Also zunächst den HTML-Quelltext nach den korrekten HTML-Regeln erstellen und dann das Layout erstellen.

Ein Beispiel für deinen Wunsch:

Code:
<!DOCTYPE html>
<html lang="de">
<head>
   <meta charset="utf-8">
   <title>Layout ohne Inhalt</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <style>
      body {
         margin: 0rem 0rem 0rem 0rem;
         display: flex;
         flex-wrap: wrap;
      }
      div:nth-child(1) {
         background-color: green;
         width: 100%;
         height: 25vh;
      }
      div:nth-child(2) {
         background-color: yellow;
         width: 50%;
         height: 25vh;
      }
      div:nth-child(3) {
         background-color: red;
         width: 50%;
         height: 25vh;
      }
      div:nth-child(4) {
         background-color: blue;
         width: 100%;
         height: 50vh;
      }
   </style>
</head>
<body>
   <div></div>
   <div></div>
   <div></div>
   <div></div>
</body>
</html>
Hey , Vielen Dank!
Ich weiss das es mir beim gererellen Webistes erstellen keienesweges helfen wird.
Trotzdem Danke!
MfG Ava