Was ist eine gute online-Ressource für die css 'design patterns'?
Kann jemand da draußen empfehlen, eine gute online-Ressource für die CSS 'design patterns'?
Ich weiß, design-patterns im software-Kontext in der Regel beziehen sich auf OO-Basis-design-Pattern, aber ich meine design-patterns im weiteren Sinne: d.h. gemeinsame, saubere Lösungen für gemeinsame Probleme /Aufgaben.
Ein Beispiel für eine solche Ressource wäre diese Liste der Tisch-designs, das gibt Ihnen alles, was Sie wirklich brauchen, um zu wissen wie man Tabellen schön Aussehen, mit einer Reihe von CSS-Techniken.
Andere Beispiele für häufige Probleme, die zu haben nett eingerichtet-Lösungen wären Dinge wie abgerundete Ecken auf divs, sehr brauchbar Formular-layouts etc.
Schreibe einen Kommentar
Du musst angemeldet sein, um einen Kommentar abzugeben.
Verweise ich auf A List Apart Artikel alle die Zeit für solche Sachen. Sie tun eine Menge von Versuch-und-Irrtum-Forschung zu kommen mit wirklich kreative Wege, um mit diesen gemeinsame CSS-Probleme in den saubersten meisten tragbaren Weise möglich.
Einige websites, Anschrift web-design-Muster sind unten aufgeführt. Sie nicht speziell, die HTML und/oder CSS, um die gewünschten Ergebnisse zu erreichen, aber bieten Sie Beispiele von live-sites, können Sie view source auf (oder, noch besser, verwenden Sie Firebug).
UI-patterns
Dies ist wahrscheinlich der beste der Reihe. Es bricht alles auf in Kategorien decken die Bandbreite der web-Seite design-Aufgaben. Finden Sie Kategorien wie beispielsweise tag-clouds, live-Vorschau und Registrierung der Nutzer unter vielen anderen. Dies ist eine wirklich umfassende Ressource, die gut organisiert ist. Es erklärt jedes Muster und bietet jede Menge Beispiele.
Pattern Tap
Ähnlich UI-Muster derzeit zwar nicht so umfassend. Es findet eine soziale Ansatz zum Sortieren von design patterns und ermöglicht den Benutzern das erstellen eigener Kategorien ("Benutzer") und füllen Sie mit Ihrer eigenen Auswahl von Websites.
Yahoo Design Pattern Library
Im Gegensatz zu den anderen beiden, die nicht bieten viele Beispiele von tatsächlichen Websites. Es ist gut gegliedert und sehr umfassend.
Design-Elemente
Dies ist ein blog präsentiert die verschiedenen Elemente der web-design. Es wird nicht erläutert, die Muster, aber ist gut als schnelle Quelle der inspiration, oder als ein Mittel, um starten Sie Ihre eigene Analyse.
Den Floatutorial ist ein guter Ausgangspunkt für das erlernen der wichtigsten CSS-Attribut "float" und wie es zu verwenden, um layout Inhalt mit einigen gemeinsamen Strukturen, einschließlich zwei-Spalte und drei Spalten liquid layouts.
Den bereits erwähnten A List Apart ist wirklich gut. Eine andere Website, die ich verwendet habe, seit ich angefangen habe, die web-Entwicklung SitePoint.com. Hier ist Ihre CSS-Referenz. Wenn Sie möchten, dass eine gute CSS-buchen Sie Ihre ist einer meiner Favoriten.
Die nächste Sache zu einem "design-pattern" im CSS sind Allgemeine layouts. Das beste Werkzeug für das nutzen von gemeinsamen layouts, Spaltenbreiten etc. ist 960 grid system, bei 960.gs
Sehen diesem screencast für eine kurze Einführung. Es spart eine Menge Zeit und hilft Ihnen, alle gängigen layout-Muster mit minimalem code:
http://net.tutsplus.com/videos/screencasts/a-detailed-look-at-the-960-css-framework/
Alles, was Sie tun müssen, ist, die richtigen Klassen und ein wenig Arithmetik, um sicherzustellen, dass alle Spaltenbreiten addieren.
Nur ein Buch, dass ich empfehlen, die am besten für CSS ist CSS-Meisterschaft von Andy Budd (cssmastery.com). Es ist etwas klein, aber es hat mir geholfen, mehr als jeder andere CSS-Buch.