et font-size ?

Version imprimable

14/02/2014, 18h56
epsilon99

Equivalence <h1>, <h2>, <h3> et font-size ?

Bonjour à tous.

Je débute en html.. je suis un bleu de bleu...

et je me pose des tas de questions.
Évidement... cours html sur DVP s'impose...

j'aurais plein de questions mais bon...
on démarre doucement...
pour moi... vraiment tout doucement..

j'ai vu l'interaction entre css et html ok.
du moins je commence à piger car cela fait beaucoup à assimiler au démarrage...

excuses a tous si il aurait préférable de mettre cela dans le forum html...
je ne savais pas trop, puisque cela concerne les deux...

ma question est la suivante..

On peut utiliser <h1> </h1> en html ou dans feuille css, le redéfinir, ou creer un style perso ok.

Mais je me demande quelle est la correspondance entre la taille réelle de h1 par exemple et font-size en px par exemple
idem pour h2 h3 h4 h5 et h6

ceci afin de me donner un point de repère si j'ai besoin de mettre des choses en très petit par exemple..
(j'ai pas mal cherché sur le net, mais bon peut être mal cherché..

d'où ma question.

Merci à tous par avance.
15/02/2014, 02h16
Invité

Bonjour,

la taille et l’apparence des éléments html dépend de chaque navigateur.
En fait, ceux-ci on un fichier css par défaut qui est tout le temps appliqué aux pages chargées.
De plus il est possible pour les utilisateur de ces navigateur de spécifier un css personnalisé (par exemple, pour empêcher Comic Sans MS d’apparaître ou pour spécifier une taille de texte minimale).

Alors plutôt que d'apprendre par cœur les css par défaut de chaque navigateur, tu peux utiliser un fichier de remise à zéro.

Les deux plus connus sont celui de Meyer (ici) et celui de HTML5Boileplate (ici).
Attention cela dit, tandis que le fichier de HTML5Boilerplate unifie le css de tous les navigateurs, celui de Meyer supprime tous les styles par défaut (et donc il faut tout refaire).
15/02/2014, 11h59
epsilon99

Re, Tout d'abord, merci de ta réponse.

vu ta réponse :

Citation:

la taille et l’apparence des éléments html dépend de chaque navigateur.

cela veut dire que <h1> sur Ie ne sera pas de la même taille que <h1> sur Firefox ? ainsi que h2, h3.... ?

c'est pareil pour "font-size", pour une taille donnée, en fonction du navigateur, ce ne sera pas la même taille ?

autre question :
je fais un test entre <h1> et font-size.. (afin de trouver la correspondance..)
n'y a t'il pas un autre moyen que de tatonner en augmentant les pixels petit à petit pour trouver la correspondance de taille ?
c'est peut être pas important du tout mais c'est quand même étonnant que l'on n'ait pas une correspondance non ?

de plus tu dis :

Citation:

En fait, ceux-ci on un fichier css par défaut qui est tout le temps appliqué aux pages chargées.

tu veux dire par là que <h1>< h2> ... etc , en fait les balises html, sont eux aussi associés à un fichier css "de normalisation"
=> ce fameux fichier css est donc lié au navigateur ou je me trompe ?

Dans ce cas, pour info, ou est-il situé dans l'arborescence de windows ? (exemple avec firefox)

Citation:

Alors plutôt que d'apprendre par cœur les css par défaut de chaque navigateur, tu peux utiliser un fichier de remise à zéro.

on peux donc redéfinir les tailles h1 h2 etc... dans un nouveau fichier css "personnalisé ?

Pour terminer ..tu dis :

Citation:

tandis que le fichier de HTML5Boilerplate unifie le css de tous les navigateurs,
celui de Meyer supprime tous les styles par défaut (et donc il faut tout refaire)

Si je comprends bien, celui de HTML5Boilerplate unifie le css de tous les navigateurs
veut dire qu'il marche avec tous les navigateurs ?

celui de Meyer supprime tous les styles par défaut
avec ce dernier, il faut tout redefinir ?

C'est cela ?

cela te paraitra peut être un peu zarbi mes questions..
mais comme je suis un bleu, ben je me poses des tas de questions...8O8O
Et encore Merci de tes infos et de ta patiente....
15/02/2014, 13h36
Invité
Bonjour,
se poser des questions, c'est bien.
Comprendre les réponses, c'est mieux.

Citation:

Envoyé par epsilon99

[B][U]...je fais un test entre <h1> et font-size.. (afin de trouver la correspondance..)

Il n'y a pas de correspondance à chercher...

Tout ce qu'il faut comprendre, c'est que :
- les balises peuvent avoir des configuration par défaut (pas forcément les même suivnat le navigateur
- pour éviter les surprises, TU peux, soit tout remettre "à zéro", soit "unifier" (via un script CSS)
- TU peux définir les tailles des éléments
Les balises <h1>,<h2>... <h6> sont des balises de hiérarchisation les titres (h1 = plus haut niveau).
C'est important notamment pour le SEO (référencement).

Je concluerai par :

Citation:

"Trop de questions tue la question"

Tu t'embrouilles TOUT SEUL et INUTILEMENT la tête...

Citation:

Envoyé par epsilon99

...ce ne sera pas la même taille ?...

La taille n'a pas d'importance. Ta copine ne te l'a pas dit ? :toutcasse:
15/02/2014, 15h15
Invité

Il faut bien différencier le rôle de l'html et du css.
Par nature l'html ne comporte aucune information sur l'apparence du document, seulement sur sa hiérarchie. Pour pouvoir représenter visuellement un document html il faut définir des règles. C'est ce que font les navigateur via leurs css. Bien que normalement le css par défaut des navigateurs soit à quelque chose prêt le même, ils comportent des différences.

Si tu veux voir les styles appliqué, il te faut ouvrir la console de développement en appuyant sur F12 (sur chome, internet explorer et firefox du moins). Dedans tu peux sélectionner des éléments et voir quels styles css sont appliqués par défaut. Les css des navigateurs sont certainement trouvable sur internet ou dans l'arborescence des fichiers, mais cela importe peu, puisqu'il sont velues et illisibles.

Lorsque tu utilise (sur ton site) un fichier css, celui-ci écrase les règles par défaut du navigateur. Si tu spécifie une taille de 10px pour ton <h1>, alors sur tous les navigateurs tes <h1> ferons 10px.

L'utilisation des fichiers css de Meyer et de HTML5Boilerplate est utile pour gommer ces différences qu'il peut exister entre les navigateurs.

Lorsqu'on te dit qu'il n'y a pas de correspondance à trouver entre la font-size et le <h1>, c'est par ce que les css sont là pour faire en sorte que la page ressemble à ce que tu veux. Il vaut mieux spécifier la taille qui te convient plutôt que de chercher la correspondance.