Wie man die Styles in einem CSS-Layout in Dreamweaver bearbeiten

Nachdem Sie eine neue Seite mit einem CSS-Layout in Dreamweaver erstellen, haben Sie eine scheinbar unendliche Anzahl von Optionen zum Bearbeiten, aber zuerst müssen Sie bestimmen, welche Arten im Stylesheet zu den Elementen entsprechen, die Sie bearbeiten möchten.

Wie Sie sich wahrscheinlich vorstellen können, können Sie die Stile in einem CSS-Layout in vielerlei Hinsicht bearbeiten, um Ihre eigenen Designs zu erstellen.

Nachdem Sie die vorhandenen Stile anpassen entwerfen die grundlegende Seite zu erhalten, wie Sie es möchten, können Sie beliebig viele weitere Stile erstellen, wie Sie wünschen.

So überprüfen Sie die verfügbaren Stile und grundlegende Änderungen vornehmen

Sie können dieselben grundlegenden Anweisungen mit jedem CSS-Layout in Dreamweaver enthalten verwenden. Um weitere Stile in einem CSS-Layout zu bearbeiten, gehen Sie folgendermaßen vor:

  1. Öffnen Sie eine Auslagerungsdatei, die in einem Dreamweaver CSS-Layout basiert, und wählen Sie Window-CSS-Stile (oder klicken Sie auf die CSS-Designer Registerkarte erweitern das Panel).

    Die CSS-Designer-Panel öffnet oder erweitert.

  2. Klicken Sie auf den Namen des Stylesheets in der Quellen-Panel an der Spitze der CSS Designer auszuwählen.

    Alle Stile mit der neuen Seite zugeordnet sind, in der Selektoren Tafel aufgeführt.

    bild0.jpg
  3. Wählen Sie den Namen eines beliebigen Stil aufgeführt in der CSS-Designer Selektoren Panel.

    Die entsprechenden CSS-Regeln für den Stil definiert sind, im Eigenschaftenfenster angezeigt, an der Unterseite des CSS-Designer-Panel. Durch Klicken auf die Liste der Arten und ihre entsprechenden Regeln der Überprüfung ist ein guter Weg, um einen schnellen Überblick über den Entwurf zu erhalten und um zu sehen, wo die verschiedenen Seitenformatierungsoptionen gespeichert sind.

Die HTML5 Kopfzeile, .nav, und Fußzeile Tags steuern die Hauptabschnitte der Seite. Beispielsweise die Kopfzeile Stil enthält eine Regel, die die Hintergrundfarbe grün macht. Somit wird am oberen Rand der Seite, um die Farbe des Kopfbereichs zu ändern, ändern Sie die Hintergrundfarbe Einstellung ändern, in der Kopfzeile Regel.

Wie Seite weite Einstellungen bearbeiten

wie die Hintergrundfarbe der Seite oder der Haupt Schriftart, Größe und Farbe der in der gesamten Seite verwendet, um Text - - Zur Seite weite Einstellungen bearbeiten Gehen Sie folgendermaßen vor:

  1. In der CSS-Designer Selektoren-Panel, wählen Sie den Stil Körper benannt.

    Die Eigenschaften der ausgewählten Stilregel definiert sind, im Eigenschaftenfenster angezeigt.

    image1.jpg
  2. Klicken Sie auf das T-Symbol am oberen Rand des Eigenschaftenfenster und ändern oder fügen Sie Ihre gewünschte Schriftart und andere Texteinstellungen.

    Sie können die Schriftart, Größe, Stil und Gewicht. Um den Abstand zwischen den Textzeilen ändern, ändern Sie die Zeilenhöhe.

  3. Blättern Sie zu dem Hintergrundbereich des Eigenschaftenfenster nach unten und verwenden Sie die Farbe auch im Hintergrund-Farbfeld eine Farbe für den gesamten Hintergrund der Seite angeben.

    Alternativ können Sie einen beliebigen hexadezimalen Farbcode im Hintergrund-Farbfeld eingeben oder mit der Pipette eine beliebige Farbe zu probieren. Um ein Hintergrundbild hinzuzufügen, klicken Sie in das URL-Feld im Abschnitt Hintergrund, und klicken Sie dann auf die Schaltfläche Durchsuchen, die das Bild angezeigt wird, und wählen Sie, die Sie als Hintergrund dienen soll. Verwenden Sie die Hintergrund-Repeat-Symbole festlegen, wie das Hintergrundbild auf der Seite wiederholt werden soll.

  4. Nehmen Sie andere Änderungen oder Ergänzungen der bereitgestellten Stilregel.

Änderungen an Stilregeln im Eigenschaftenfenster werden automatisch gespeichert und auf Inhalte mit der Regel formatiert.

Wie anpassen Content-Bereiche

Um die Breite oder andere Einstellungen der wichtigsten Content-Bereiche, die die Gesamtgröße der Seite steuern ändern und die Kopfzeile, Fußzeile und Sidebar Gehen Sie folgendermaßen vor:

  1. Um die Breite des gesamten Hauptdesignbereich ändern:

  1. Drücke den .Container Stil in der Selektoren Platte des CSS Designer-Panel.

    Die Eigenschaften der .Container Stil werden in der Regel im Eigenschaftenfenster angezeigt, in dem Sie auch den Stil bearbeiten können.

  2. Ändern Sie die Größe im Feld Breite oder geben Sie eine neue Nummer für die gewünschte Seitenbreite.

    Die Breite der Seitengestaltung wird automatisch basierend auf der Größe geändert Sie eingegeben haben. Wenn Sie die Breite des ändern .Container Stil, können Sie die Breite des gesamten Design ändern, weil alle Tags und andere Elemente in der Formatierung mit dem enthaltenen .Container Stil - und sie sind alle die füllen zu erweitern gesetzt .Container .

  • Um die Größe des Inhaltsbereichs der Seite ändern, wählen Sie den Stil benannt .Inhalt und geben Sie die Größe und andere Optionen, die Sie im Eigenschaftenfenster wünschen.

    Wenn Sie die Breite des Inhaltsbereichs in einem Layout zu ändern, die eine Sidebar enthält, müssen Sie die Breite der Seitenleiste als auch ändern.

  • Um die Hintergrundfarbe von jeder Art auf der Seite zu ändern, klicken Sie auf den Namen des entsprechenden Stil und ändern Sie die Einstellungen im Abschnitt Hintergrund der Tafel Eigenschaften.

    Zum Beispiel in den CSS-Layouts in Dreamweaver wird die Seitenleiste in einem Stil .sidebar1 Namen definiert. So die Hintergrundfarbe zu ändern, würden Sie in der Selektoren Panel klicken .sidebar1, wählen Sie die Kategorie Background im Panel Eigenschaften, und wählen Sie die gewünschte Farbe. In ähnlicher Weise die Hintergrundfarbe des Headers zu ändern, wählen Sie den Stil-Header in der Panel-Selektoren genannt und die Farbe gut verwenden.

    image2.jpg
  • Um ein Bild in der Kopfzeile hinzu:

  • Wählen Sie den Platzhalter Bild markiert Logo einfügen und drücken Sie die Entf oder Rücktaste.

  • Wählen Sie Einfügen -Image-Bild und wählen Sie die Bildquelle auswählen Dialogfeld ein Bild mit.

  • Ersetzen von Text und Einfügen von Bildern in der Sidebar und Hauptinhaltsbereiche.

    Sie können Text und Einfügen von Bildern in einer beliebigen Seite hinzufügen oder ersetzen von einem CSS-Layout erstellt, so wie man es in irgendeiner anderen Webseite.

  • Wählen Sie Datei-Speichern Sie alle Seite und Stile zu speichern.

  • Menü