Operation Manual

Table Of Contents
174
VERWENDEN VON DREAMWEAVER
Seiten mit CSS erstellen
Last updated 10.4.2012
Platzhaltertext in einem Div-Tag ändern
Markieren Sie den Text und überschreiben Sie ihn oder drücken Sie die Entf-Taste.
Note: Sie können dem
div-Tag genau wie einer Seite Inhalt hinzufügen.
Die Markierungsfarbe von Div-Tags ändern
Wenn Sie den Zeiger in der Entwurfsansicht über die Kante eines div-Tags führen, hebt Dreamweaver die Tag-
Rahmen hervor. Sie können die Markierungsfunktion nach Bedarf aktivieren oder deaktivieren oder die
Markierungsfarbe im Dialogfeld „Voreinstellungen“ ändern.
1 Wählen Sie „Bearbeiten“ > „Voreinstellungen“ (Windows) bzw. „Dreamweaver“ > „Voreinstellungen“
(Macintosh).
2 Wählen Sie in der Liste links die Kategorie „Markierung“.
3 Führen Sie einen der folgenden Schritte aus und klicken Sie auf „OK“.
Um die Markierungsfarbe für div-Tags zu ändern, klicken Sie in das Farbfeld „Mouse-Over“ und wählen Sie mit
dem Farbwähler eine Markierungsfarbe aus (oder geben Sie den Hexadezimalwert für die Markierungsfarbe im
Textfeld ein).
Um die Markierung von div-Tags zu aktivieren bzw. zu deaktivieren, aktivieren bzw. deaktivieren Sie das
Kontrollkästchen „Anzeigen“ für „Mouse-Over“.
Note: Diese Optionen wirken sich auf alle Objekte aus, wie beispielsweise auf Tabellen, die in Dreamweaver
hervorgehoben werden, wenn Sie den Zeiger darüber bewegen.
CSS-Layout-Blöcke
CSS-Layout-Blöcke visualisieren
In der Entwurfsansicht können Sie CSS-Layout-Blöcke visualisieren. Ein CSS-Layout-Block ist ein HTML-
Seitenelement, das Sie an einer beliebigen Stelle auf der Seite positionieren können. Genauer gesagt ist ein CSS-Layout-
Block entweder ein
div-Tag ohne display:inline oder ein anderes Seitenelement, das die CSS-Deklaration
display:block, position:absolute oder position:relative enthält. Im Folgenden finden Sie einige Beispiele
von Elementen, die in Dreamweaver als CSS-Layout-Blöcke angesehen werden:
Ein div-Tag
Ein Bild, dem eine absolute oder relative Position zugewiesen wurde
Ein a-Tag, dem der Stil display:block zugewiesen wurde
Ein Absatz, dem eine absolute oder relative Position zugewiesen wurde
Note: Damit CSS-Layout-Blöcke visuell wiedergegeben werden können, enthalten Sie keine Inline-Elemente (d. h.
Elemente, deren Code in einer Textzeile enthalten ist) und auch keine einfachen Blockelemente (wie z. B. Absätze).
Dreamweaver bietet eine Auswahl an visuellen Hilfsmitteln zum Anzeigen von CSS-Layout-Blöcken. Sie können beim
Entwerfen z. B. Konturen, Hintergründe oder das Box-Modell für CSS-Layout-Blöcke aktivieren. Sie können
außerdem die QuickInfo anzeigen, die Eigenschaften zu einem ausgewählten CSS-Layout-Block anzeigt, indem Sie
den Mauszeiger über den Layout-Block führen.
Die folgende Liste mit visuellen Hilfsmitteln für CSS-Layout-Blöcke beschreibt, welche Elemente Dreamweaver für
jeden Layout-Block wiedergibt:
CSS-Layout-Konturen Zeigt die Konturen aller CSS-Layout-Blöcke auf der Seite an.