Gewusst wie: Verwenden der Symbolleiste "Stilanwendung"

Aktualisiert: November 2007

Mithilfe der Symbolleiste Stilanwendung können Sie Stile erstellen und ändern. Sie können die Symbolleiste Stilanwendung mit anderen CSS-Tools in Visual Studio verwenden. Dazu gehören die Fenster CSS-Eigenschaften, Stile verwalten und Stile übernehmen.

Wenn Sie ein Seitenelement entwerfen, das noch keine CSS-Stilregel hat, können Sie die Symbolleiste Stilanwendung verwenden, um einen neuen Stil zu erzeugen und anzuwenden. Sie können beispielsweise einen Abschnitt auswählen und eine Farbe für den Text festlegen, indem Sie die Symbolleiste Stilanwendung verwenden. In diesem Fall wird durch Visual Studio eine neue CSS-Stilregel erstellt und auf den Text angewendet. Wenn Sie eine andere Eigenschaft desselben Abschnitts formatieren, etwa dessen Schriftartfamilie, wird der erzeugten Stilregel von Visual Studio eine neue Eigenschaftendeklaration hinzugefügt.

Arbeiten mit der Symbolleiste "Stilanwendung"

Mithilfe der Symbolleiste Stilanwendung können Sie Stile erstellen und ändern. Hierfür stehen Ihnen der automatische und der manuelle Modus zur Verfügung. Wenn Sie mit CSS nicht vertraut sind, sollten Sie den automatischen Modus verwenden, damit Stilregeln automatisch von Visual Studio erzeugt werden. Wenn Sie Erfahrung mit CSS haben, können Sie den manuellen Modus verwenden, um die Erstellung der Stilregel in allen Einzelheiten zu steuern.

Im manuellen Modus können Sie einem anderen Stil eine neue Eigenschaftendeklaration hinzufügen. Dies schließt einen neuen Stil, einen anderweitig erzeugten Stil und einen von Ihnen erzeugten Stil ein. Wenn Sie den manuellen Modus verwenden, werden einer Website von Visual Studio ggf. Elemente hinzugefügt, damit der Stil richtig angewendet wird.

Übersicht über die Symbolleiste "Stilanwendung"

In der folgenden Tabelle werden die Elemente der Symbolleiste Stilanwendung aufgelistet.

Hinweis:

   Wenn Sie im automatischen Modus arbeiten, sind die Dropdownliste Zielregel und die Schaltfläche Vorhandenen Stil wiederverwenden deaktiviert.

Element

Beschreibung

Mithilfe der Dropdownliste Stilanwendung können Sie den Modus festlegen, in dem Stile erzeugt und geändert werden. Wenn Sie mit CSS nicht vertraut sind, verwenden Sie den automatischen Modus. Wenn Sie Erfahrung mit CSS haben, können Sie den manuellen Modus verwenden, um den Entwurfsprozess zu optimieren.

Die Dropdownliste Zielregel beeinflusst neue CSS-Eigenschaften. Sie können sie verwenden, um den Namen des zu ändernden Stils anzuzeigen oder um den Stiltyp anzuzeigen, der für das aktuelle Element erzeugt wird. Standardmäßig wird auf den Stil mit der höchsten Priorität zurückgegriffen. Wenn kein Stil vorhanden ist, wird Neue automatische Klasse als Standard verwendet.

Die Dropdownliste Zielregel stellt die folgenden Optionen bereit. Die Auswirkung jeder Option ist von der aktuellen Auswahl abhängig.

  • Inlinestil   Überarbeiten einer vorhandenen Eigenschaftendeklaration oder Hinzufügen einer neuen Eigenschaftendeklaration zu einem bestehenden Inlinestil.

  • Neue Inlineformatvorlage   Die Eigenschaftendeklaration einem neu erzeugten Inlinestil hinzufügen und den Stil auf das aktuelle Starttag anwenden. Diese Option ist nur verfügbar, wenn für das aktuelle Seitenelement noch kein Inlinestil existiert.

  • Neue Auto-ID "#id"   Erstellen eines neuen Stils für eine verwendete ID, für die keine Regel festgelegt wurde. Diese Option ist nützlich, wenn Sie Stile auf Seitenelemente anwenden möchten, denen Sie IDs, jedoch noch keinen Stil zugeordnet haben.

  • Neue automatische Klasse   Erstellen eines neuen Stils für eine verwendete Klasse, für die noch keine Regel festgelegt wurde.

  • Neue automatische Klasse ".rule"   Die Eigenschaftendeklaration einem automatisch generierten, klassenbasierten Stil hinzufügen und dann den Stil auf das aktuelle Startag anwenden. Diese Option ist nützlich, wenn Sie Stile auf Seitenelemente anwenden möchten, denen Sie eine Klasse, aber noch keinen Stil zugeordnet haben.

  • Neue Formatvorlage zuweisen   Erzeugen eines neuen Stils mithilfe des Dialogfelds Neuer Stil und wahlweises Anwenden dieses Stils auf die aktuelle Auswahl.

Die SchaltflächeVorhandenen Stil wiederverwenden beeinflusst Änderungen, die an vorhandenen Stilen und Eigenschaften vorgenommen wurden. Wenn für die zu formatierende Eigenschaft im ausgewählten Stil keine Deklaration enthalten ist, jedoch in einem anderen Stil der aktuellen Auswahl, so wird von Vorhandenen Stil wiederverwenden festgelegt, welcher Stil geändert wird. Wenn Vorhandenen Stil wiederverwenden ausgewählt ist, wird die Eigenschaft, die bereits eine Deklaration enthält, geändert. Wenn Vorhandenen Stil wiederverwenden nicht ausgewählt ist, wird die ausgewählte Regel geändert.

Die SchaltflächeOverlay anzeigen legt fest, ob bei Elementen, für die die ausgewählte Regel gilt, ein Overlay angezeigt wird. Wenn diese Option ausgewählt ist, wird vom Designer ein gepunktetes Feld um den Inhalt angezeigt, der den in der Dropdownliste Zielregel ausgewählten Stil verwendet. Dieses Overlay ermöglicht Ihnen zu verfolgen, welche Elemente von Änderungen beeinflusst werden, die Sie mit der Symbolleiste Stilanwendung vornehmen. Dies ist besonders nützlich, wenn Sie mehrere Regeln anwenden, da es den Zugriff auf eine bestimmte, zu ändernde Regel erleichtert.

Verwenden der Symbolleiste "Stilanwendung" mit ASP.NET-Steuerelementen

Sie können die Symbolleiste Stilanwendung verwenden, um Stile von ASP.NET-Serversteuerelementen zu verändern, wenn diese eine Formatierung unterstützen. Ebenso können Sie die Symbolleiste verwenden, um Stile auf Serversteuerelemente anzuwenden, die Eigenschaften für Inlinestile und das CssClass-Attribut definieren und die von der WebControl-Klasse erben. Für Benutzersteuerelemente sind diese Eigenschaften nicht definiert. Deshalb können Sie die Symbolleiste nicht für Benutzersteuerelemente verwenden.

ID-basierte Stile sollten nicht für Serversteuerelemente verwendet werden. Der im Markup oder Servercode zugeordnete Name ist nicht notwendigerweise die ID des dargestellten HTML-Elements. Deshalb sind IDs keine zuverlässige Möglichkeit, Serversteuerelemente zu formatieren.

Verwenden der Symbolleiste "Stilanwendung"

Sie können den Anwendungsmodus auf der Symbolleiste Stilanwendung zum Festlegen einstellen, wie Stilregeln erzeugt werden sollen.

So legen Sie den Anwendungsmodus in der Symbolleiste "Stilanwendung" fest

  • Klicken Sie auf der Symbolleiste Stilanwendung auf die Dropdownliste Stilanwendung, und klicken Sie dann auf Automatisch oder auf Manuell.

Mit der Symbolleiste Stilanwendung können Sie bequem neue Stile erstellen oder vorhandene Stilregeln ändern.

So erstellen Sie neue Stile mithilfe der Symbolleiste "Stilanwendung"

  1. Wechseln Sie in der Ansicht Entwurf oder der Ansicht Quelle zum Stilanwendungsmodus Manuell.

  2. Markieren Sie den zu formatierenden Inhalt.

  3. Klicken Sie auf der Symbolleiste Stilanwendung auf die Dropdownliste Zielregel, und führen Sie einen der folgenden Schritte aus:

    • Um einen neuen Stil zu erzeugen, der auf der anzuwendenden Formatierung basiert, und diesen auf den aktuellen Inhalt anzuwenden, wählen Sie Neuer Inlineformatvorlage, Neue Auto-ID oder Neue automatische Klasse, und formatieren Sie dann den Inhalt.

    • Um einen neuen Stil mithilfe des Dialogfelds Neuer Stil zu entwerfen und diesen wahlweise auf die aktuelle Auswahl anzuwenden, wählen Sie Neue Formatvorlage zuweisen.

Sie können eine vorhandene Stilregel, die auf eine Auswahl angewendet wird, verändern oder eine neue Eigenschaftendeklaration für eine Stilregel erzeugen.

So ändern Sie vorhandene Stile mithilfe der Symbolleiste "Stilanwendung"

  1. Wechseln Sie in der Ansicht Entwurf oder der Ansicht Quelle zum Stilanwendungsmodus Manuell.

  2. Markieren Sie den zu formatierenden Inhalt.

  3. Klicken Sie auf der Symbolleiste Stilanwendung in der Liste Zielregel auf den Stil, den Sie anwenden möchten.

  4. Wenn für die zu formatierende Eigenschaft im ausgewählten Stil keine Deklaration enthalten ist, jedoch in einem anderen Stil der aktuellen Auswahl, wählen Sie Vorhandenen Stil wiederverwenden zum Ändern des vorhandenen Stils.

  5. Formatieren Sie den Inhalt.

Siehe auch

Konzepte

Gewusst wie: Verwenden der Fenster "Stile übernehmen" und "Stile verwalten"

Gewusst wie: Verwenden des Fensters "CSS-Eigenschaften"