tête de tableau
Avec un grand nombre de tableaux de la page, chaque un ensemble pratique du titre qui contient le nom de la table et une description. A cet effet , il y a une balise HTML spéciale <CAPTION>, qui définit le texte et sa position par rapport à la table. La meilleure façon de placer le texte dans le milieu de la table ou le fond de celui - ci, dans d' autres cas, les différents navigateurs interprètent les paramètres de balise <caption>, ce qui explique pourquoi le résultat est inégal. Par défaut, le titre est placé au-dessus du centre de la table, sa largeur ne dépasse pas la largeur de la table et dans le cas où il est automatiquement transféré à la nouvelle ligne du texte long. Pour modifier le titre du poste dans la balise <CAPTION> il aligner paramètre, qui peut prendre les valeurs suivantes.
gauche - aligne la tête sur le bord gauche de la table. Firefox est un texte sur le côté de la table, Internet Explorer et Opera un titre en haut, en l'alignant sur la gauche.
droit - dans Internet Explorer et Opera a un en- tête du haut de la table et l' aligne sur le bord droit de la table. Firefox affiche un en-tête du côté droit de la table.
centre - le titre se trouve sur le dessus de la table en son centre. Cet emplacement est spécifié dans le navigateur par défaut.
haut - le résultat est similaire au centre de paramètre d'action, mais à la différence qu'il est inclus dans la spécification HTML 4 et est compris par tous les navigateurs.
bas - le titre est placé au bas de la table en son centre.
Comme on peut le voir à partir de la description, obtenir un code universel, les mêmes œuvres dans différents navigateurs, dans le cas de l'en-tête mise en page sur la droite ou la gauche, il est assez problématique. Dans ce cas, nous arrivons aux styles d'aide et attribut particulier text-align. Sa mission - pour rendre le texte aligné sur le bord désiré. Exemple 1 montre comment définir le titre sur le dessus de la table et d'aligner son bord droit. Notez que la balise <CAPTION> est à l' intérieur du conteneur <TABLE>, il est l'emplacement par défaut.
Exemple 1. Création d'un en-tête de table avec une balise <CAPTION>
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = windows-1251">
<Titre> Titre de la table </ title>
<Style type = "text / css">
TABLE {
margin: 0 auto; / * Aligne la table au milieu * /
}
CAPTION {
text-align: right; / * Aligner à droite * /
font-style: italic; / * Le texte en italique * /
}
</ Style>
</ Head>
<Body>
<Table width = "80%" border = "1" cellpadding = cellspacing "4" = "0">
<Caption> données d'extraction Changement de ressources </ caption>
<Tr>
<Th> & nbsp; </ th> <th> 2003 </ th> <th> 2004 </ th> <th> 2005 </ th>
</ Tr>
<Tr>
<Td> Pétrole </ td> <td> 43 </ td> <td> 51 </ td> <td> 79 </ td>
</ Tr>
<Tr>
<Td> Or </ td> <td> 29 </ td> <td> 34 </ td> <td> 48 </ td>
</ Tr>
<Tr>
<Td> arbre </ td> <td> 38 </ td> <td> 57 </ td> <td> 36 </ td>
</ Tr>
</ Table>
</ Body>
</ Html>
Ce qui suit est un exemple du résultat (Fig. 1). Notez que le titre ne soit pas strictement aligné sur le bord droit de la table, car elle, ainsi que sur le contenu des cellules actes établissant cellpadding. On peut imaginer que le titre est une autre cellule de la table, qui est soumise à des caractéristiques de cellpadding et cellspacing.
Fig. 1. Voir l'en-tête de table dans le navigateur Opera
Facilité d'utilisation balise <CAPTION> est que le titre créé avec elle est attachée à la table et ne va pas au - delà de la portée du conditionnel, limité par sa largeur. Cependant, le même résultat peut être obtenu à l'aide de styles, comme illustré ci-dessous dans l'exemple 2.
Exemple 2: Création d'un en-tête de table avec des styles
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = windows-1251">
<Titre> Titre de la table </ title>
<Style type = "text / css">
TABLE {
margin: 0 auto; / * Aligne la table au milieu * /
}
.Caption {
margin: 0 à 15%; / * Rembourrage sur le dessus et le côté du texte * /
padding-bottom: 4px; / * Le champ ci - dessous le texte * /
text-align: right; / * Aligner à droite * /
font-style: italic; / * Le texte en italique * /
}
</ Style>
</ Head>
<Body>
<P class = "caption"> données d'extraction Changement de ressources </ p>
<Table width = "70%" border = "1" cellpadding = cellspacing "4" = "0">
<Tr> <td> ... </ td> </ tr>
</ Table>
</ Body>
</ Html>
Cet exemple crée une nouvelle classe nommée légende, qui est appliqué au paragraphe (balise <P>). Dans ce cas, le tableau est aligné au centre de la page Web, de sorte que la même chose devrait se produire avec le paragraphe. A cet effet, ajouter de rembourrage à la gauche et à droite dans la marge de réglage. Dans lequel une largeur indiquent clairement, il est obtenue en soustrayant la largeur totale de la fenêtre (100%) deux fois le renfoncement à gauche (dans cet exemple 15%). Ainsi, il apparaît que la largeur du bloc de texte coïncide avec la largeur de la table. Dans le cas d'utilisation en tant que pixel de l' unité, il est recommandé d'utiliser la balise <caption>.
© Copyright Politique www.htmlbook.ru
Commentaires
Commentant, gardez à l' esprit que le contenu et le ton de vos messages peuvent blesser les sentiments des gens réels, montrer du respect et de la tolérance à ses interlocuteurs, même si vous ne partagez pas leur avis, votre comportement en termes de liberté d'expression et de l' anonymat offert par Internet, est en train de changer non seulement virtuel, mais dans le monde réel. Tous les commentaires sont cachés à l'index, le contrôle anti - spam.