„So erstellen Sie ein Layout mit Div und CSS'

Einführung in das CSS-Layout von div +s
Lernen Sie CSS-Layout? Sie können das reine CSS-Layout immer noch nicht ganz beherrschen? Normalerweise gibt es zwei Situationen, die Ihr Lernen behindern:
Die erste Möglichkeit besteht darin, dass Sie das Prinzip der CSS-Seitenverarbeitung nicht verstanden haben. Bevor Sie die Gesamtleistung Ihrer Seite betrachten, sollten Sie zunächst die Semantik und Struktur des Inhalts berücksichtigen,
Fügen Sie dann CSS für Semantik und Struktur hinzu. In diesem Artikel erfahren Sie, wie Sie HTML strukturieren.
Ein weiterer Grund ist, dass Ihnen die sehr vertrauten Attribute der Präsentationsebene (z. B. cellpadding, hspace, align="left" usw.) fehlen und Sie nicht wissen, was Sie tun sollen
Konvertieren Sie in die entsprechende CSS-Anweisung. Wenn Sie das erste Problem gelöst haben und wissen, wie Sie Ihren HTML-Code strukturieren, gebe ich Ihnen eine Liste mit detaillierten Angaben zur Originaltabelle
Welches CSS sollte ich verwenden, um das aktuelle Attribut zu ersetzen?
Strukturiertes HTML
Wenn wir zum ersten Mal lernen, eine Webseite zu erstellen, überlegen wir immer zuerst, wie wir sie gestalten sollen, und berücksichtigen dabei die Bilder, Schriftarten, Farben und Layoutpläne. Dann verwenden wir Photoshop
Oder zeichnen Sie es in Fireworks und schneiden Sie es in kleine Bilder. Bearbeiten Sie abschließend den HTML-Code, um alle Designs auf der Seite wiederherzustellen.
Wenn Sie möchten, dass Ihre HTML-Seite mit CSS (CSS-freundlich) gestaltet wird, müssen Sie noch einmal von vorne beginnen. Denken Sie nicht zuerst an das „Erscheinungsbild“, sondern zuerst an Ihre Seite Semantik und Struktur des Inhalts.
Das Aussehen ist nicht das Wichtigste. Eine gut strukturierte HTML-Seite kann jedes Aussehen annehmen, und CSS Zen Garden ist ein Paradebeispiel dafür. CSS Zen
Garden hilft uns, endlich die Leistungsfähigkeit von CSS zu erkennen.
HTML dient nicht nur zum Lesen auf einem Computerbildschirm. Ihre sorgfältig in Photoshop gestalteten Bilder werden möglicherweise nicht auf PDAs, Mobiltelefonen und Bildschirmleseprogrammen angezeigt. Aber
Es handelt sich um eine gut strukturierte HTML-Seite, die durch verschiedene CSS-Definitionen überall und auf jedem Netzwerkgerät angezeigt werden kann.
Fangen Sie an zu denken
Das erste, was man lernen muss, ist, was „Struktur“ ist, was manche Autoren auch „Semantik“ nennen. Dieser Begriff bedeutet, dass Sie Ihre Inhaltsblöcke und den Zweck jedes einzelnen Inhalts analysieren müssen
Zweck und richten Sie dann die entsprechende HTML-Struktur basierend auf diesen Inhaltszwecken ein.