Was ist Ihr CSS Style?

Einer der verwirrenden Aspekte der Arbeit mit CSS (Cascading Style Sheets) ist, dass Sie Stile auf so viele Arten schreiben kann. Ähnliche Prosa zu schreiben, nur weil Sie die Grundregeln der Grammatik und Rechtschreibung zu verstehen bedeutet nicht, Sie prägnante Prosa gemeistert haben zu schreiben.

Erfahrene CSS Designer verbringen viel Zeit kurz, klar CSS Crafting, die leicht zu bearbeiten und zu aktualisieren ist. Aber diejenigen, die auf CSS neu sind, sind anfällig für mehr Arten als nötig zu schreiben und redundante Stile zu schaffen.

Nicht nur, dass redundanten Code länger dauern an einen Web-Browser herunterladen, es ist viel schwieriger zu bearbeiten oder später revidieren. Und je mehr redundanten Code, desto wahrscheinlicher sind Sie in Stil Konflikte zu laufen.

Hier sind fünf Tipps für das Schreiben saubere, effiziente Stile:

  • Nie schaffen zwei Arten, wenn man genug ist. Zum Beispiel können Sie einen Stil mit dem Tag-Selektor für alle Tags erstellen, die die Schriftfamilie Ihrer Schlagzeilen ändert, und dann eine zweite Art mit einem Klassenauswahl erstellen, die Sie auf Ihre Schlagzeilen anwenden können, um die Farbe zu ändern.

    Aber es wäre effizienter, sowohl die Farbe zu definieren und die Schriftfamilie im gleichen Stil. Denken Sie daran, dass Sie jederzeit zurückgehen und bearbeiten Sie einen Stil eine weitere Regel hinzufügen, wenn Sie den Stil der Formatierung ändern möchten.

  • Kürzen hexadezimalen Farbcodes. Sie können durch die Einbeziehung der gesamten hexadezimalen Farbcode Farben in CSS definieren. Wenn Sie jedoch Farbcodes verwenden, die sich wiederholende sind, müssen Sie nur die ersten drei Zeichen enthalten. Beispielsweise #ffffff ist das gleiche wie #fff- sowohl die Farbe weiß erstellen.

  • Verwenden Sie externe Stylesheets. Sie können an der Spitze jeder Web-Seite Stile in einem internen Stylesheet definieren, oder Sie können Ihre Stile in einer externen Datei mit der Erweiterung .css speichern und diese Stylesheet auf alle Ihre Web-Seiten anhängen. Externe Stylesheets sind von Natur aus effizienter, da sie es Ihnen ermöglichen, auf einen oder alle Seiten auf Ihrer Website den gleichen Stil zu verwenden.

    Zum Beispiel, wenn Sie einen Stil festlegen, dass alle Hauptüberschriften fett, blau macht, und groß, dass Stil in einem externen Stylesheet speichern, können Sie den gleichen Stil für jede Schlagzeile verwenden. Dann entscheiden, ob Sie später, dass Sie Ihre Schlagzeilen zu grün ändern möchten, können Sie den Stil in einem externen Stylesheet ändern und alle Schlagzeilen auf einmal ändern.

    Wenn Sie die Stile in einem internen Stylesheet gespeichert hatte, würden Sie die Schlagzeile Stil in jeder Datei bearbeiten müssen.

  • Entwickeln Sie eine Namenskonvention für Ihre Stile. Obwohl Sie Stile erstellt mit der Klasse oder ID-Selektoren einen beliebigen Namen, die Sie mögen, ist es am besten Arten zu wählen, die abgesehen von der Formatierung Bedeutung haben. Zum Beispiel, wenn Sie einen Stil erstellen genannt .redHeadlines und dann später entscheiden, Sie wollen, dass alle Ihre .redHeadlines zu sein, blau, werden Sie entweder mit einem blauen Überschrift Stil am Ende genannt .redHeadlines oder müssen den Stil umbenennen.

    Und der Stil Umbenennung enthält zurückzugehen und das erneute Anwenden, dass Stil überall eine rote Schlagzeile, die Sie wollen, blau zu werden, die Art der Macht der Stile negiert globalen Updates machen. Um dieses Problem zu vermeiden, erstellen Sie Stil-Namen, die auf die Position oder Bedeutung der Elemente beziehen, wie zum Beispiel .mainHeadlines oder .sidebarHeadlines.

  • *Testen Sie und Ihren Code validieren. Selbst erfahrene CSS Designer Fehler machen, weshalb Dreamweaver so viele großartige Werkzeuge für die Prüfung umfasst und den Code in Ihre Web-Seiten zu validieren. Stellen Sie sicher, testen Sie Ihre CSS für häufige Fehler.

    Im Folgenden sind zwei Online-Test-Dienstleistungen, die Sie für Fehler in Ihrem CSS-Code zu überprüfen, verwenden können. die URL einer Webseite auf dem Internet in das Adressfeld auf eine dieser Websites einfach eingeben und auf die Schaltfläche klicken Sie auf Senden einen Bericht, der alle Fehler im Code zu erhalten:

Ähnliche

Menü