Wie Verwenden von Local Styles für HTML5 und CSS3 Programmierung

Ein Stil kann direkt im HTML5 Körper definiert werden. Hier ist ein Beispiel für diese Art von Code. Ein lokaler Stil wird manchmal auch als ein Element-Ebene

Stil, weil sie modifiziert, eine bestimmte Instanz eines Elements auf der Seite.

bild0.jpg
localStyles.html

Lokale Stile

Dieser Absatz hat einen lokal definierten Grenze

Dieser Absatz hat eine Reihe von Schriftart und Textregeln angewendet.

Wie Sie über diesen Code aussehen, sollte ein paar Dinge deutlich geworden:

  • Nein Element ist in der Kopfzeile. Normalerweise verwenden Sie einen Abschnitt im Seitenkopf alle Stile zu definieren. Diese Seite hat kein solches Segment.

  • Die Absätze haben ihren eigenen Stil Attribute. EIN Stil Attribut wurde in der HTML-Körper zu jedem Absatz hinzugefügt. Alle HTML-Elemente unterstützen die Stil Attribut.

  • Der gesamte Stil-Code geht in einem einzigen Paar von Anführungszeichen. Für jeden Stil Element, geht der gesamte Stil in ein Paar von Anführungszeichen, weil es ein HTML-Attribut ist. Sie können Vertiefung und weißen Raum nutzen, um Dinge leichter verständlich zu machen.

Wenn der lokale Stile zu verwenden

Lokale Stile sollten nicht Ihre erste Wahl sein, aber sie können unter bestimmten Umständen nützlich sein.

Wenn Sie ein Programm schreiben, von einem Textverarbeitungsprogramm oder einem anderen Werkzeug zu übersetzen, sind lokale Stile oft der einfachste Weg, um die Übersetzungsarbeit zu machen. Wenn Sie ein Textverarbeitungsprogramm verwenden, um eine Seite zu erstellen und Sie es sagen, die Seite als HTML zu speichern, wird es verwenden häufig lokale Stile, weil Wort oft Prozessoren diese Technik in ihren eigenen proprietären Format verwenden.

Normalerweise, wenn Sie eine HTML-Seite mit vielen lokalen Arten, ist es, weil ein automatisches Übersetzungstool die Seite gemacht.

Manchmal sehen Sie lokale Stile in Codebeispielen verwendet. Zum Beispiel könnte der folgende Code verwendet werden, um verschiedene Stile Grenze zu demonstrieren:

localBorders.html

Inline Borders

Dieser Absatz hat einen soliden schwarzen Rand

Dieser Absatz hat einen doppelten schwarzen Rand

Zum Beispiel Zwecke, ist es hilfreich, den Stil direkt neben dem Element zu sehen. Dieser Code wird zur Demonstration oder Testzwecke in Ordnung sein (wenn Sie nur einen kurzen Blick auf einige Stile Grenze erhalten möchten), aber es wäre keine gute Idee, für die Produktion Code.

Lokale Arten haben eine sehr hohe Priorität, so alles, was Sie in einem lokalen Stil hat Vorrang vor den anderen Stilregeln gelten. Dies kann eine nützliche Abhilfe, wenn Dinge nicht funktionieren, wie Sie erwarten, aber es ist besser, Ihre Stile bekommen arbeiten als korrekt auf einer Vermeidung des Problems zu verlassen.

Die Nachteile der lokalen Stile

Es ist ziemlich einfach, einen lokalen Stil, aber zum größten Teil anzuwenden, wird die Technik der Regel nicht empfohlen, da es einige Probleme hat, wie zum Beispiel

  • Ineffizienz: Wenn Sie definieren Stile auf Elementebene mit der Stil Attribut, du definieren Sie nur die bestimmte Instanz. Wenn Sie Absatz Farben für die gesamte Seite auf diese Weise einstellen wollen, werden Sie eine Menge von Stilregeln schriftlich beenden.

  • Ablesbarkeit: Wenn Stilinformationen in der gesamten Seite durchsetzt ist, ist es viel schwieriger, als zu finden und zu ändern, wenn es in der Kopfzeile zentral gelegen ist (oder in einem externen Dokument).

  • Fehlende Trennung: die Stile auf Elementebene platzieren besiegt den Ziel-Gehalt von Stil zu trennen. Es wird viel schwieriger, Veränderungen zu machen, und die Mischung von Stil und Inhalt macht den Code schwerer zu lesen und zu ändern.

  • Ungeschicklichkeit: Eine ganze Reihe der CSS-Regeln hat mit einem Paar von Anführungszeichen in einer einzigen HTML-Attribut gestopft werden. Dies kann schwierig sein, zu lesen, weil Sie haben CSS direkt in den Fluss der HTML integriert.

  • Zitat Probleme: Das HTML-Attribut erfordert Anführungszeichen, und einige CSS-Elemente erfordern auch Anführungszeichen (Schriftfamilien mit Leerzeichen in ihnen, zum Beispiel). mehrere Ebenen von Zitaten in einem einzigen Element zu haben, ist ein Rezept für Ärger.

Menü