15 alignement, styles de police, et les séparateurs horizontaux

Dans cette section de la spécification traite certains éléments du langage HTML et les attributs qui peuvent être utilisés pour les éléments de mise en forme visuelle. Un grand nombre d' entre elles sont indésirables .

15.1 Mise en forme

15.1.1 Couleur de fond

Définition d' attributs

l'bgcolor = couleur [CI]
Non recommandé. Cet attribut définit la couleur des cellules du corps ou de table document de fond.

Cet attribut définit la couleur du corps du document (élément de fond du corps ) ou (éléments de table CREATE TABLE , TR , TH et TD ). Dans l'élément BODY peut utiliser des attributs supplémentaires pour spécifier la couleur du texte.

L'utilisation de cet attribut est pas recommandé , à la place, utiliser une feuille de style.

15.1.2 Alignement

Aligner les éléments de bloc (tableaux, images, objets, paragraphes, etc.) en utilisant l'attribut align . Bien que l'attribut peut être défini pour de nombreux éléments HTML, sa gamme de valeurs possibles dans différentes cellules peut être différent. Il ne traite que d'aligner attribut pour le texte.

les définitions d' attributs

la align = left | center | right | justifier [CI]
Non recommandé. Cet attribut spécifie l'alignement horizontal de son élément par rapport au contexte environnant. Les valeurs possibles sont:
  • gauche: lignes de texte sont rendus aligné à gauche.
  • centre: les lignes de texte sont centrées.
  • droite: les lignes de texte sont rendus aligné à droite.
  • justifient: les lignes de texte sont alignées sur les deux bords.

La valeur par défaut dépend de la direction générale du texte. Pour le texte de gauche à droite, la valeur par défaut est align = gauche, moi le texte de droite à gauche - align = right.

EXEMPLE DÉCONSEILLÉ:
Dans cet exemple, l'intertitre.

 <H1 align = "center"> Comment Carve bois </ H1>

L'utilisation de CSS, par exemple, vous pouvez obtenir le même effet comme suit:

 <HEAD>
  <TITLE> Comment Carve Bois </ TITLE>
  <STYLE type = "text / css">
  H1 {text-align: center}
  </ STYLE>
 <BODY>
  <H1> Comment Carve bois </ H1>

S'il vous plaît noter que toutes les offres sont alignées avec le H1 . Vous pouvez limiter la portée du style en définissant l'attribut de la classe :

 <HEAD>
  <TITLE> Comment Carve Bois </ TITLE>
  <STYLE type = "text / css">
  H1.wood {text-align: center}
  </ STYLE>
 <BODY>
  <Classe H1 = "bois"> Comment Carve bois </ H1>

EXEMPLE DÉCONSEILLÉ:
De même, pour aligner le bord droit du paragraphe d'attribuer le code HTML du align , vous pouvez écrire:

  <P align = "right"> ... texte du paragraphe ...
 

et en utilisant le CSS:

  <HEAD>
  <TITLE> Comment Carve Bois </ TITLE>
  <STYLE type = "text / css">
  P.mypar {text-align: right}
  </ STYLE>
 <BODY>
  <P class = "mypar"> ... texte du paragraphe ...

EXEMPLE DÉCONSEILLÉ:
Pour aligner le bord droit d'une série de paragraphes, de les regrouper avec l'élément DIV :

  <DIV align = "right">
  <P> ... le premier paragraphe ... <P> ... texte du deuxième alinéa ... <P> ... texte du troisième paragraphe ... </ DIV>

Utilisation de propriétés d'alignement de texte CSS est héritée de l'élément parent, de sorte que vous pouvez utiliser:

  <HEAD>
  <TITLE> Comment Carve Bois </ TITLE>
  <STYLE type = "text / css">
  DIV.mypars {text-align: right}
  </ STYLE>
 <BODY>
  <Div class = "mypars">
  <P> ... le premier paragraphe ... <P> ... texte du deuxième alinéa ... <P> ... texte du troisième alinéa ...

  </ DIV>

Pour centrer en utilisant l'ensemble de CSS document:

  <HEAD>
  <TITLE> Comment Carve Bois </ TITLE>
  <STYLE type = "text / css">
  BODY {text-align: center}
  </ STYLE>
 <BODY>
  ... Le corps du document est centré ...

 </ BODY>

En utilisant l'élément CENTER absolument équivalent à utiliser l'élément DIV attribut l'alignement , qui est réglé sur «centre». Utilisez élément CENTER indésirable .

15.1.3 objets Clip

Les images et les objets peuvent être «construits» ou fixés au bord de la page, en modifiant temporairement le champ de texte à l'égard de l'objet.

Fixation d' un objet  

Attribut aligner des objets, des images, des tableaux, cadres, etc. Elle conduit au fait que l'objet est attaché au bord gauche ou à droite. En règle générale, les objets sont fixés avec une nouvelle ligne. Les valeurs suivantes peuvent être définies pour cet attribut:

  • gauche: L'objet est fixé à la marge de gauche actuelle. Le texte qui suit circule autour de l'image sur la droite.
  • droite: L'objet est fixé à la marge de droite actuelle. Le texte qui suit circule autour de l'image sur la gauche.

EXEMPLE DÉCONSEILLÉ:
L'exemple suivant montre comment fixer l'élément IMG au champ gauche.

 <IMG align = "left" src = "http://foo.com/animage.gif" alt = "mon bateau">

Certains attributs d'alignement permettent la valeur «centre», qui ne fixe pas l'objet, mais il se concentre sur les domaines actuels. Cependant, pour les éléments P et DIV valeur "centre" provoque le contenu de l'élément de centrage.

Wrap objet texte  

Un autre attribut, défini pour l'élément de la BR , contrôle le flux de texte autour des objets attachés.

les définitions d' attributs

clair = none | left | right | all [CI]
Non recommandé. Indique l'emplacement où la ligne suivante de la traduction devrait apparaître dans un navigateur visuel, provoqué par cette chaîne d'éléments. Cet attribut permet aux objets saisissables (images, tableaux, etc.). Les valeurs possibles sont:
  • none: La ligne suivante commence de la manière habituelle. Cette valeur est utilisée par défaut.
  • gauche: La ligne suivante commencera à la ligne la plus proche en dessous de l'objet attaché dans la marge gauche.
  • droite: La ligne suivante commencera à la ligne la plus proche en dessous de l'objet attaché à la marge de droite.
  • tous: La ligne suivante commencera à la ligne la plus proche en dessous de tout objet attaché sur le terrain.

Considérez le scénario visuel suivant, où une pellicule de texte est à la droite de l'image pour un saut de ligne en utilisant le BR :

 **************** -------
 |  |  -------
 |  une image |  - <BR>
 |  |
 ****************

Si l'attribut est clair est réglée sur zéro, la ligne qui suit le BR , commencer immédiatement derrière lui à la droite de l'image:

 *************** -------
 |  |  -------
 |  une image |  - <BR>
 |  |  ------
 ***************

EXEMPLE DÉCONSEILLÉ:
Si l'attribut est clair est fixé à gauche ou la totalité, la ligne suivante apparaîtra comme suit:

 *************** -------
 |  |  -------
 |  une image |  - <BR Clear="left">
 |  | 
 ***************
 -----------------

Avec des feuilles de style, vous pouvez spécifier ce comportement pour toutes les parties des lignes pour tous les objets (images, tableaux, etc.) attachés au champ gauche. Vous pouvez obtenir cet effet de la manière suivante en utilisant le CSS:

 <STYLE type = "text / css">
 BR {clear: left}
 </ STYLE>

Pour déterminer ce comportement seulement pour certains cas d'un élément de la BR , d'utiliser l' attribut id :

  <HEAD>
 ...

 <STYLE type = "text / css">
 BR.mybr {clear: left}
 </ STYLE>
 </ HEAD>
 <BODY>
 <P> ...
 *********** -------
 |  |  -------
 |  Table |  - <BR Id="mybr">
 |  | 
 ***********
 -----------------
 ...
 </ BODY>

15.2 Fonts

Les éléments HTML suivants définissent les informations de police. Bien que tous ne sont indésirables , il est conseillé de les utiliser au lieu de la feuille de style.

15.2.1 Les éléments qui déterminent le style de police : les éléments de la TT , I , Chambre , de BIG , de SMALL , STRIKE , S et U

  <! ENTITY% fontstyle
  " Le TT | I | Chambres | BIG | SMALL ">
 <! ELEMENT ( % fontstyle; | % l'expression; ) - - ( % de la ligne; ) *>
 <ATTLIST (! % FontStyle; | % l'expression; )
  % attrs;
  - % Coreattrs , % i18n , % events -
  >

Balise de début: obligatoire, balise fermante: obligatoire

Des représentations des éléments qui définissent le style de police, dépend de l'agent utilisateur. Ce qui suit est une description informative seulement.

TT: Il semble comme une police à espacement fixe (police machine à écrire).
I: Il est en italique.
B: Il est en gras.
BIG: Il semble police "grand".
SMALL: Il est un "petit" font.
STRIKE et S: indésirable. Il est barré texte.
U: Non recommandé. Il est souligné la police.

La phrase suivante montre plusieurs types de texte:

 <P> <b> gras </ b>,
 <I> italic </ i>, <b> <i> bold italic </ i> </ b>, <tt> chasse fixe </ tt> et 
 <Big> big </ big> et <small> petit </ small> texte.

Les mots sont les suivants:

Un exemple des différents styles de police

Vous pouvez obtenir une plus grande variété d'effets à l'aide de feuilles de style. Pour demander un paragraphe en italique bleu en utilisant le CSS, notez:

  <HEAD>
 <STYLE type = "text / css">
 P.mypar {font-style: italic;  color: blue}
 </ STYLE>
 </ HEAD>
 <P id = "mypar"> ... texte en bleu et en italique ...
 

des éléments de style de police doivent être correctement imbriquées. des éléments de style de présentation imbriqués dépend de l'agent utilisateur.

15.2.2 Éléments de gestion des polices: la police et BASEFONT

Utilisation des éléments POLICES et BASEFONT indésirables .

La définition formelle de cm. En Transitional la DTD .

les définitions d' attributs

taille   = CDATA [CN]
Non recommandé. Définit la taille de la police. Les valeurs possibles sont:
  • Un nombre entier de 1 à 7. définir une taille de police fixe dont l'exécution dépend de l'agent utilisateur. Pas tous les agents utilisateurs peuvent représenter les sept tailles.
  • Changement relatif de la taille de la police. La valeur "1" signifie une taille plus grande. La valeur "-3" signifie trois tailles de police plus petite. Toutes les dimensions se réfèrent à une échelle de 1 à 7.
couleur = couleur [CI]
Non recommandé. Cet attribut définit la couleur du texte.
visage = cdata [CI]
Non recommandé. Cet attribut spécifie une liste de noms de police séparés par une virgule, la recherche de cet agent utilisateur doit effectuer dans l'ordre de priorité.

Element POLICES change la taille de la police et la couleur pour le texte de son contenu.

Element BASEFONT définit la taille de police de base ( en utilisant l'attribut de taille). Modifier la taille de la police en utilisant l'élément POLICES produit par rapport à l'élément de taille de base fixe BASEFONT . Si l'élément BASEFONT n'a pas été utilisé, la taille par défaut de 3.

EXEMPLE DÉCONSEILLÉ:
L'exemple suivant montre la différence entre les sept tailles de police qui sont installés en utilisant l'élément de la police :

 <P> <font size = 1> size = 1 </ font>
 <Font size = 2> size = 2 </ font>
 <Font size = 3> size = 3 </ font>
 <Font size = 4> size = 4 </ font>
 <Font size = 5> size = 5 </ font>
 <Font size = 6> size = 6 </ font>
 <Font size = 7> size = 7 </ font>

Il peut apparaître comme suit:

Un exemple de la différence de taille de la police

Ce qui suit est un exemple d'installation de tailles de police relatives à l'aide d'une taille de base de 3:

Un exemple de la différence de la taille en utilisant basefont

La taille de la police de base ne concerne pas les titres, si elles ne sont pas modifiés en utilisant l'élément POLICES à une taille de police relative.

15.3 Séparateurs: élément HR

 <! ELEMENT HR - A propos de VIDE La - ligne horizontale -> <! ATTLIST HR % coreattrs;
  - Id , classe , le style , le titre - événements%;
  > 

Balise de début: requise, Balise de fin: interdite

les définitions d' attributs

la align = left | center | droit [CI]
Non recommandé. Cet attribut spécifie l'alignement horizontal du séparateur par rapport au contexte environnant. Les valeurs possibles sont:
  • à gauche: le séparateur est aligné à gauche.
  • centre: Séparateur centré.
  • droite: le séparateur est aligné à droite.

La valeur par défaut est align = center.

noshade [CI]
Non recommandé. Si cet attribut est défini, il offre à l'agent utilisateur de fournir un séparateur avec une couleur unie plutôt que le style de deux ton habituel.
size = pixels [CI]
Non recommandé. Cet attribut spécifie la hauteur du séparateur. La valeur par défaut dépend de l'agent utilisateur.
la largeur = la longueur [CI]
Non recommandé. Cet attribut spécifie la largeur du séparateur. La valeur par défaut est de 100%, à savoir, toute la largeur de la page.

Point HR conduit à la génération des séparateurs horizontal agents utilisateurs visuels.

La hauteur de l'espace vide entre le séparateur et le texte dépend de l'agent utilisateur.

EXEMPLE ILLEGAL:
Dans cet exemple, les entretoises sont centrées, et leur taille est fixée à la moitié de la largeur entre les champs. Le séparateur supérieur a une épaisseur par défaut et dont l'épaisseur est réglée à 5 pixels les plus faibles. séparateur inférieur doit être muni d'une couleur unie sans un soupçon:

  <Largeur de HR = "50%" align = "center">
 <HR size = largeur "5" = "50%" align = "center">
 <HR noshade size = largeur "5" = "50%" align = "center">

Ces séparateurs peuvent être représentés comme suit:

Un exemple des différents séparateurs horizontaux