Frage

Siehe Abschnitt /* Common Classes */ dieser Seite.

http://webdesign.about.com/od/css/a /master_stylesht_2.htm

ist diese CSS-Klassen gut, in jedem Projekt zu benutzen? in Bezug auf die semantische?

/* Common Classes */

.clear { clear: both; }

.floatLeft { float: left; }

.floatRight { float: right; }

.textLeft { text-align: left; }

.textRight { text-align: right; }

.textCenter { text-align: center; }

.textJustify { text-align: justify; }

.blockCenter { display: block; margin-left: auto; margin-right: auto; } /* remember to set width */

.bold { font-weight: bold; }

.italic { font-style: italic; }

.underline { text-decoration: underline; }

.noindent { margin-left: 0; padding-left: 0; }

.nomargin { margin: 0; }

.nopadding { padding: 0; }

.nobullet { list-style: none; list-style-image: none; }
War es hilfreich?

Lösung

Nein. Sie sind nicht eine gute Wahl. Der ganze Sinn von CSS und insbesondere über den Begriff der Klasse ist „was“ etwas bedeutet, nicht „wie“ es angezeigt werden soll beschreiben. Was etwas Mittel (das heißt seine Semantik) und wie es scheint (das heißt seine Präsentation) sind zwei Konzepte getrennt. Die Tatsache, dass etwas, sagen wir, ein Menü ändert sich nicht, wenn Sie es blau auf hellblau mit einem Stylesheet und einen hohen Kontrast schwarz auf weiß auf einem anderen Sheet gemacht für farbenblinde Menschen zu zeigen, entscheiden.

Wenn Sie geben Klasse eine Präsentation Bedeutung, Ändern, wie ein Dokument angezeigt werden Änderungen in dem Web-Seite HTML erfordern würde, den ganzen Punkt zu besiegen CSS als Technologie, die speziell entwickelt, um und encapsulate Präsentation gestaltet. Um dies zu verhindern, wäre die Alternativen Klassen, deren Namen am Ende mit nicht repräsentiert angemessene Informationen (z Klasse namens „bluefont“, das eigentlich eine Farbe enthält: rot-Richtlinie). Daher als Name „bluefont“ aufweist, ist völlig willkürlich, und hier wird mit dem eigentlichen Inhalt desynchronisiert. Es könnte eine zufällige Zeichenfolge „abgewdgbcv“ gewesen, aber dann ist es besser, etwas zu wählen, die Präsentation und vermittelt keinen Zusammenhang bedeutet: seine zugehörige Semantik.

Und wir schließen den Kreis: es ist der ganze Sinn der Klassen ist. Siehe auch dieses Dokument bei W3 .

Andere Tipps

Nein, nicht wirklich.

Vorzugsweise ein Klassenname sollte beschreiben, was Sie verwenden es für nicht genau das, was es tut.

Wenn Sie zum Beispiel Namen eine Klasse „bluebold“ und dann entscheiden, dass sich der Text rot zu sein und kursiv, du hast entweder um eine neue Klasse zu erstellen und verändern überall es verwendet wird, oder Sie mit einem Klassennamen am Ende dass nicht mehr paßt.

Ein Punkt, dass ich vorschlagen möchte, ist, wenn Sie erweitern diese nur sicherstellen, dass Sie nur Verben verwenden, anstatt alle Adjektive als Namen der Verwendung für die Klassen und Sie sollten gut sein!

Edit:

Ich stimme mit anderem Punkt von Klassennamen darstellen, was es für verwendet wird, nicht genau das, was es tut.

Gemeinsame CSS-Klassen sind viel zu körnig und classitis Problem fördern. Pseudo-Selektoren können das Problem zu einem gewissen Grad mildern. Vorausgesetzt, dass eine neue Website entwickelt wird, würde ich Folgendes tun:

*{
margin:0;
padding:0
}

li {
list-style: none; 
list-style-image: none;
}

Der Rest ist schwer zu Adresse, floatLeft und floatRight sind vom Layout definiert werden,

<div id="main">
<div class="searchPanel">
</div>
<div class="resultsPanel">
</div>
</div>

Die CSS sollte idealerweise aussehen (Layout angetrieben)     #main searchPanel {     float: left;     }     #main resultsPanel {     schweben rechts;     }

Hope erhalten Sie die Idee. Ich jedoch Gesicht Probleme mit fett / unterstrichenen Text. Unterstrichen Text ist bezeichnend für hässlich Design. Benutzer neigen dazu, solche mit Hyper-Links zu verwechseln

einige recomendations:

  1. .floatLeft -> .float-left: kein Kamel verrohrt.

  2. .bold -> .important Name sollte mit dem Ziel, sagt nicht zeigen, wie es zu tun

  3. .nobullet -> ul.nobullet ist besser meist angegeben zur Vermeidung von Konflikten mit anderen CSS.

  4. werden
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top