sont ces classes CSS bon noms?

Question

Voir section /* Common Classes */ de cette page.

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

sont ces classes CSS bon, à utiliser dans un projet? en termes de sémantique?

/* 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; }

Answer 1

Non

. Ils ne sont pas de bons choix. Le point entier de css et en particulier sur le concept de classe est de décrire « ce » quelque chose représente, et non « comment » il devrait apparaître. Quels sont les moyens de quelque chose (à savoir sa sémantique) et la façon dont il apparaît (à savoir sa présentation) sont deux concepts séparés. Le fait que quelque chose est, par exemple, un menu ne change pas si vous décidez de le montrer bleu sur bleu clair avec une feuille de style et de contraste élevé noir sur blanc sur une autre feuille de style pour les personnes en daltoniens.

Si vous donnez un sens classe de présentation, en changeant la façon dont un document apparaît nécessiteraient des changements dans le code HTML de la page Web, défaisant le point entier d'avoir CSS comme une technologie spécialement conçue pour fournir et présentation encapsulent. Pour éviter cela, l'alternative serait de finir par avoir des classes dont les noms ne représentent pas des renseignements raisonnables (par exemple classe appelée « bluefont » qui contient en fait une couleur: directive rouge). Par conséquent, avoir « bluefont » comme un nom est tout à fait arbitraire, et ici devient désynchronisé avec le contenu réel. Cela aurait pu être une chaîne aléatoire « abgewdgbcv », mais il est préférable de choisir quelque chose qui est sans rapport avec la présentation et communique un message: sa sémantique associée.

Et nous fermons le cercle: il est le point entier des classes. Voir aussi ce document à W3 .

Answer 2

Non, pas vraiment.

un nom de De préférence la classe doit décrire ce que vous utilisez pour, pas exactement ce qu'il fait.

Si par exemple le nom d'une classe « bluebold », puis décidez que vous voulez que le texte soit rouge et en italique, vous avez soit pour créer une nouvelle classe et changer partout où il est utilisé, ou vous vous retrouvez avec un nom de classe qui ne correspond plus à.

Answer 3

Un point que je voudrais suggérer est, quand vous étendez ces assurez-vous que vous venez d'utiliser des verbes au lieu d'utiliser des adjectifs comme noms pour les classes et vous devriez être bon!

Modifier

Je suis d'accord avec d'autres points de noms de classes représentant ce qu'il est utilisé pour, pas exactement ce qu'il fait.

Answer 4

classes CSS communes sont trop granuleuse et promouvoir problème classitis. sélecteurs de pseudo peuvent atténuer le problème dans une certaine mesure. En supposant un nouveau site Web est conçu que je ferais ce qui suit:

*{
margin:0;
padding:0
}

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

Les autres sont difficiles à traiter, floatLeft et floatRight sont à définir par la mise en page,

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

Le CSS devrait idéalement ressembler (moteur mise en page)     #main searchPanel {     float: left;     }     #main resultsPanel {     Flotter à droite;     }

Je espère que vous avez l'idée. Je cependant, confrontés à des problèmes avec le texte en gras / souligné. texte Souligné est une indication de la conception laid. Les utilisateurs ont tendance à confondre avec comme hyper-liens

Answer 5

certains recomendations:

1. .floatLeft -> .float-left: pas de chameau tubé.

2. .bold -> .important nom doit dire l'objectif montrant pas comment le faire

3. .nobullet -> ul.nobullet Mieux vaut être le plus indiqué pour éviter les conflits avec d'autres css.