Wenn ja, welche? Warum? Wenn nein, warum? Wie behebt man browserübergreifendes CSS-Rendering?Verwenden Sie ein CSS-Framework?
Ich benutze derzeit Blaupause CSS, und ich frage mich, ob es eine gute Wahl ist. Vielen Dank! :)
Nein, ich bin jeden Rahmen nicht verwenden, nur ein gut durchdachtes Benennungssystem, das ich wieder verwende immer und immer und eine grundlegende CSS mit einem paar Resets und einige grundlegende Stile.
Warum verwende ich kein CSS-Framework?
Die Verwendung eines Frameworks setzt normalerweise voraus, dass der Designer mit seinen Konventionen vertraut ist, was oft nicht der Fall ist - Sie sind nicht derjenige, der die Seite gestaltet oder der Client hat seinen eigenen Designer. Und selbst wenn dies nicht der Fall ist, wird es immer Designs geben, die nicht in 960 Pixel passen oder einfach eine gerade Größe haben, so dass Sie Ihre magische .span-4-Klasse nicht verwenden können.
Was mich zum nächsten Punkt führt. Die Benennung ist nicht semantisch. Theoretisch würden Sie erwarten, dass ein Framework die Pflege einer großen Site erleichtert. Angenommen, Sie müssen eine kleine Designänderung vornehmen. Das bedeutet im Grunde genommen, den HTML-Code über alle beteiligten Vorlagenansichten hinweg zu ändern. Dies ist auch mit einem Versionierungssystem schwierig und riskant, da es eine Sache ist, auf eine einzelne CSS-Datei und eine andere auf 100 Ansichten zurückzusetzen. Alles weil input.span-19 5 Pixel weniger haben sollte. CSS-Frameworks - das neue Inline-CSS.
Was ist mit Cross-Browser-Problemen? Entweder Sie verwenden ein Framework oder nicht, das wird sich nicht ändern. Es gibt Browser oder Betriebssysteme mit bestimmten Besonderheiten. Bottom Line - Internet Explorer wird immer noch so viel saugen.
CSS Frameworks zeichnen sich durch Disziplin aus, und ich muss ihnen dafür danken, aber am Ende geht es nur um den, der den Code schreibt.
Ich mag die yui css Werkzeuge. Diese Leute haben definitiv mehr Zeit mit cross browser css verbracht, als mir lieb ist. Ich habe andere nicht ausprobiert.
Ich benutze yahoos yui-css Framework. Das ist der erste, dem ich begegnet bin und der leicht zu verstehen war. Ich habe gerade das Video und den Cheatsheet gesehen und es funktioniert. Auch Yahoo verwendet es auf einigen ihrer Seiten.
Ich habe Blueprint-css an einigen Stellen verwendet und fand es ziemlich nützlich.
Die 960 Grid System ist ein Versuch, den Webentwicklungsworkflow zu rationalisieren, indem häufig verwendete Dimensionen auf einer Breite von 960 Pixeln bereitgestellt werden. Es gibt zwei Varianten: 12 und 16 Spalten, die einzeln oder im Tandem verwendet werden können.
Ich ziehe Flüssigkeit Version von 960.gs: Fluid 960 Grid System
Die Compass/Sass-Kombination ist fantastisch und bietet mehrere Plugins für die Verwendung des Frameworks Ihrer Wahl ohne die nicht-semantischen Klassennamen. Außerhalb von Compass fand ich Frameworks immer zu restriktiv und nutzte zu viel Markup.
Ich bin kein Fan der Blueprint, 960gs und YUI Plugins für Compass: Sie wurden ursprünglich für zusätzliche Markups entwickelt und nutzen Compass/Sass nicht für zusätzliche Flexibilität. Also habe ich 'Susy' gebaut - ein flexibles Framework, das in Compass/Sass integriert ist.
Welches Plugin Sie auch verwenden (oder selbst schreiben), ich empfehle Compass/Sass als bessere Option als Extra-Markup.
Ihr Link ist tot. – markus
behoben, danke: http://susy.oddbird.net/ –
Gerade gestartet ein Projekt mit 960 Gitter. Der Designer hat sich schon früh dafür entschieden und ließ seine Entwürfe führen.
Ich muss sagen, es ist viel viel schneller. Verbringen Sie viel weniger Zeit damit, Pixel auf Mockups zu messen, fragen Sie den Designer nach der Absicht und fuzzieren Sie mit CSS, um "Seitenvorlagen" zu erstellen. Verbringe viel mehr Zeit mit der Umsetzung der Designs.
Ich habe meine eigene Teilmenge von Klassen erstellt, von denen ich mich sehr häufig benutze, das macht mich schneller arbeiten und erstellen HTML-Layouts viel einfacher, ohne die gleichen Eigenschaften unter vielen Klassen zu wiederholen.
Zum Beispiel für Inline-Divs habe ich FL und FR-Klassen, um Float rechts und links darzustellen, für Fluidbreiten habe ich 20 Breitenklassen. Hier sind einige Klassen aus meinem generischen Stylesheet, die ich erwähnt habe. Es funktioniert für mich.
.fl { display:inline; float:left;}
.fll { display:inline!important; float:left!important;}
.fr { display:inline; float:right}
.frr { display:inline!important; float:right!important;}
.ib { display: -moz-inline-block; display:inline-block;}
.clear { clear: both}
.none {display:none;}
.noni {display: none!important;}
.block {display:block;}
.blocki {display: block!important;}
.pointer {cursor: pointer !important;}
...
.w10 { width: 10% !important; }
.w15 { width: 15% !important; }
.w20 { width: 20% !important; }
.w25 { width: 25% !important; }
...
So kann diese Technik kein Rahmen Ersatz natürlich sein, aber das funktioniert gut genug, wenn Sie irgendeine andere Sache zwischen Arten haben nicht wollen, und Sie :)
Sinan.
P.S. In IE6 und darunter funktionieren mehrere Klassen fehlerhaft, dies ist in modernen Browsern zu verwenden. siehe the table at Quirksmode
Ich benutze ein paar regelmäßig und ich würde empfehlen, sie zu überprüfen.
heymuscle ist ein reaktions CSS-Framework, das 1140px/960px/ipad/iphone ähnlich wie 960gs
960 grid ist eines der beliebtesten Grids da draußen passt und bietet einen einfachen Klassen verwenden zum Auslegen von Ihrer Seite
1140 grid ist ein flüssiges Layout
hoffe, das hilft
ich zwei große Missverständnisse über CSS-Frameworks bemerkt habe.
Erstens gibt es eine Menge Verwirrung zwischen dem Konzept eines Frameworks in der Software-Entwicklung, als ein Werkzeug und eine Art von Framework wie 960gs.
Wikipedia defines a framework als "eine Abstraktion, in der Software, die generische Funktionalität zur Verfügung stellt, durch Benutzercode selektiv geändert werden kann und so anwendungsspezifische Software zur Verfügung stellt".
@vise sagt: "Ich benutze kein Framework, nur ein gut durchdachtes Benennungssystem, das ich immer wieder benutze und ein grundlegendes CSS mit ein paar Resets und einigen Basisstilen." Dies ist vergleichbar mit der Aussage "Ich benutze kein Framework, nur ein Framework". Dies ist wahrscheinlich eine Art semantischer Ironie. Nichts für ungut beabsichtigt :)
Blueprint, 960, Kompass usw. sind alle Arten von Frameworks. Da einige CSS-Frameworks möglicherweise nicht semantisch sind oder bestimmte wünschenswerte Eigenschaften nicht aufweisen, bedeutet dies nicht, dass CSS-Frameworks eine schlechte Idee sind.
Das zweite Missverständnis ist, dass css und css-Frameworks sich gegenseitig ausschließen.Sie können CSS entweder von Hand codieren oder Sie verwenden ein Framework (mit einigen benutzerdefinierten Sachen). Aber ... warte mal ... ist CSS nicht ein Satz von Standardelementen, die wir ändern oder erweitern können, um unseren spezifischen Anforderungen gerecht zu werden? CSS sieht verdächtig nach Wikipedia-Definition wie ein Framework aus.
Natürlich ist dieser zweite Punkt umstritten. Aber oft stelle ich fest, dass Leute eine Art Framework benutzen, ohne es zu wissen.
Um Ihre Frage zu beantworten, neige ich dazu, etwas wie sass zu verwenden und my own framework zu machen. Bei meinem neuesten Projekt verwende ich eine Kombination aus dieser und Bourbon, die bis jetzt gut aussieht. Der Hauptgrund für die Verwendung von Frameworks liegt darin, dass ich die Redundanz in CSS satt habe. Es ist wirklich langweilig, immer dieselben Werte wiederholen zu müssen. Es gibt andere Konzepte im Design, die CSS nicht sehr gut macht, auf die ich hier nicht eingehen werde (siehe here). Aber mithilfe eines Frameworks ist es möglich, alle Ihre Probleme zu abstrahieren und nur daran zu arbeiten, Dinge zu erledigen.
Ich hoffe, das hilft!
+1 zur Erklärung von Problemen mit CSS-Frameworks. – strager
völlig richtig. Ich habe 960g einmal für ein größeres Projekt verwendet und bin auf alle erwähnten Probleme gestoßen. – kurczak
Ein Punkt, mit dem ich nicht einverstanden bin: Cross-Browser-Kompatibilität. Meine Entscheidungen beschränken sich darauf, das Design einfach genug zu halten, um alle Probleme zu umgehen ODER alle Ins, Outs und Hacks von CSS zu lernen ODER ein Werkzeug wie Grid 960 zu verwenden, das die Lösungen wunderbar eingebaut hat. Grid 960 liefert die gleichen Ergebnisse mit einem Prozent Diskrepanz zwischen FireFox und IE7, was weit mehr ist, als ich sonst erreichen könnte. (Gott segne Nathan Smith für die Erstellung von Grid 960.) – Smandoli