CSS-Layout-Änderung in Adobe CS5 Dreamweaver

Abode Creative Suite 5 (Adobe CS5) Dreamweaver bietet mehrere Möglichkeiten, um eine Cascading Style Sheets Seitenlayout zu ändern. Ein CSS-Layout ist komplett von Stylesheet-Regeln gesteuert, so dass Sie das Look and Feel der Seite direkt aus dem Bedienfeld CSS-Stile und Eigenschafteninspektor ändern können.

Jede Spalte, Feld und Platz auf der neuen Seite positioniert und dimensioniert, CSS-Regeln und Eigenschaften verwenden, die Sie alle entweder aus dem Eigenschafteninspektor (auf dem Bedienfeld CSS-Stile) oder CSS-Regel-Definition-Panel anpassen können.

  1. Wenn das Bedienfeld CSS-Stile nicht bereits geöffnet ist, wählen Sie Stile Window-CSS zu öffnen.

  2. Wählen Sie die Registerkarte Alle das Stylesheet und seine Regeln anzuzeigen.

    Der interne Stylesheet ist als an der Spitze gezeigt. Klicken Sie auf den kleinen Pfeil nach links um sie zu erweitern und zeigen alle Regeln enthält. Layouts einen angeschlossenen (extern) Stylesheet mit dem Namen (wie styles.css) anstelle des Tag-Stylesheet anzuzeigen.

  3. Wähle aus Körper Regel.

    Dieser Tag-basierte Stil steuert die allgemeine Formatierung der gesamten Seite (alles innerhalb des Tags).

  4. Klicken Sie auf das Feld neben dem Hintergrund der Regel it- zu bearbeiten, anstatt halten die # 4E5869 (Mittelgrau) einstellen, geben Sie einen hexadezimalen Farb (wie # CC0000 für rot) an die Hintergrundfarbe der Seite ändern.

  5. Klicken Sie auf das Farbfeld neben der Farbregel die Swatches zu öffnen Panel- einen neuen Standardtyp Farbe für den Text auf der Seite auswählen.

  6. An der Spitze des Bedienfelds CSS-Stile, wählen Sie einen anderen Stil (zum Beispiel die .twoColElstHdr #container Stil) Um seine Eigenschaften anzuzeigen.

    Das .twoColHybLtHdr #Container ID-Stil steuert die Größe und das Aussehen des Haupt Layout-Container auf der Seite.

  7. Im Eigenschafteninspektor bearbeiten Sie die Eigenschaften das Aussehen des Stils zu ändern.

    Zum Beispiel können Sie die Breite der Regel ändern, indem Sie eine neue Nummer in der Breite Regel Textfeld eingeben. Bei der Eingabe von 95%, zum Beispiel, machen Sie das gesamte Layout breiter.

Jede Spalte und Abschnitt, Ihr Layout umfasst, das von einer der ID Stile aufgelistet im Bedienfeld CSS-Stile gesteuert. Fast jeder ID-Stil verfügt über eine Breite Eigenschaft können Sie die Größe der verschiedenen Bereiche auf der Seite ändern verwenden.

Weiter auf verschiedene Arten ändern im Bedienfeld CSS-Stile aufgelistet und sehen, wie sie verschiedene Elemente auf Ihrer Seite beeinflussen. Versuchen Sie, die Art Farbe, Schriftfamilie ändern und andere Eigenschaften, wie Polsterung und Hintergrundfarbe.

Um genau herauszufinden, welche ID Kontrollen, welche Spalte oder Abschnitt, klicken Sie im Seitenbereich und Blick auf den Tag-Selektor am unteren Rand des Dokumentfensters. Der letzte Tag am Ende der Kette zeigt Ihnen, welche Container Sie sind in und die entsprechende ID im Bedienfeld CSS-Stile (zum Beispiel).

Menü