CSS: Quelle est la bonne façon de traiter plusieurs classes de texte?

Question

Donc, je suis à la commission pour un site Web, et j'essaie d'améliorer mon code. Quand il s'agit d'un site web avec plusieurs types de polices (ici c'est grand, là c'est petit, là c'est gras, ici c'est souligné, etc.) est-ce là où on utilise le h1-h6, ou réservons-nous pour les moments où il y a une hiérarchie définie, en utilisant à la place <p class="xxx"> pour définir différentes classes de texte?

Answer 1

1. Vous déterminez pourquoi il devrait être grand, petit, gras, souligné ou etc.
2. Vous écrivez le balisage qui exprime la sémantique vous avez déterminé en utilisant 1 div et span (les éléments libres sémantiques) si rien plus approprié existe et en ajoutant class et id si vous avez besoin de quelque chose de plus spécifique que tout ce que le HTML fournit explicitement.
3. Vous écrivez sélecteurs CSS qui correspondent à un balisage pour appliquer ces ensembles de règles qui styles

rubriques d'utilisation Alors que si vous avez rubriques, et de les utiliser dans l'ordre. h1 pour la rubrique principale, h2 des sous-positions, h3 pour subsubheadings, etc.

Si vous ne pouvez pas generate a sensible table of contents des rubriques, vous certainement ne les utilisez pas correctement.

Answer 2

Utilisez h1-h6 où ils sont censés être utilisés. Utilisez des classes pour décorer votre texte, y compris dans le p ou h1-h6.

En règle générale, gardez un œil sur l'apparence de votre site Web sans feuille de style. Vous êtes OK tant que votre site Web est capable de transmettre le message même sans feuille de style. À titre de suggestion, je vous rappelle que vous pouvez utiliser plusieurs classes sur les étiquettes. Vous pouvez l'utiliser pour définir plus petit, plus simple ensemble de règles telles que:

.bigFont { font-size: 150%; } 
.italicFont { font-style: italic; } 
.grayFont { color: Gray; } 
... 

et appliquez une ou plusieurs de ces styles sur les étiquettes.

Answer 3

Sémantiquement h1 - h6 sont pour les en-têtes. Si les différents types de polices sur votre site sont toutes les rubriques alors bien, je soupçonne qu'ils ne le sont pas.

De même p est utilisé pour les paragraphes.

Si vous avez différents paragraphes qui ont différents styles de texte in..then oui

<p class="firststyle">This is paragraph 1</p> 

<p class="secondstyle">This is paragraph 2</p> 

mais rappelez-vous ces balises ont une signification. Pour plus d'informations, see this article