SVM n°213 mars 2003
SVM n°213 mars 2003
  • Prix facial : 4 €

  • Parution : n°213 de mars 2003

  • Périodicité : mensuel

  • Editeur : Excelsior Publications

  • Format : (204 x 280) mm

  • Nombre de pages : 166

  • Taille du fichier PDF : 182 Mo

  • Dans ce numéro : DivX, MP3, films, disques... téléchargez !

  • Prix de vente (PDF) : gratuit

Dans ce numéro...
< Pages précédentes
Pages : 148 - 149  |  Aller à la page   OK
Pages suivantes >
et , et chaque cellule dans une ligne, par . Les données (texte, image...) sont inscrites entre ces balises (ici, le numéro de ligne et de colonne). Le navigateur a calculé la largeur (hauteur) de chaque colonne 1 r32 (ligne) en fonction du contenu des cellules. Pour l'heure, la balise table contient l'attribut Créer des titres et des en-têtes Pour définir un titre au-dessus de votre tableau, placez - juste après la balise
148 149
114ral internet en étapes Maîtrisez le code HTML de vos tableaux sur le Web Bien que les éditeurs de code HTML permettent de dessiner directement les tableaux, une bonne compréhension de leurs mécanismes de construction vous sera utile pour maîtriser le code de vos pages Web. Vous pouvez vous servir du Bloc-notes de Windows pour y taper vos lignes de code. Enregistrez le fichier sous le Définir le tableau de base
1:1 1:2 1:3 1:4
2:1 2:2 2:3
3:1 3:2
4:1
nom tableau.html sans fermer le Bloc-notes. Un double clic sur ce fichier fera apparaître le résultat dans le navigateur, et à chaque nouvel enregistrement, il vous suffira d'actualiser la page pour suivre l'évolution du tableau. Vous trouverez le fichier d'exemple sur http://pratiquesvm.vnunet.fr/svm213/tableau.htm. — François Dupin Les balises et
annoncent un tableau. Entre les deux, chaque ligne sera encadrée par les balises
et
- un Entete et tees de colonnes DT1 I T2 T3iel l 571 12 1:3 2:1 2:2 273 rii Fl 3 2 14 riF I 1 B2 B3 ri., - 14.8 svni Mars 2003 texte tapé entre les balises . Il sera centré par rapport au tableau et non sur la fenêtre. Une nouvelle ligne, valign=bottom, placera un titre en dessous du tableau : ici une ligne
. L'attribut valign accepte aussi left et right pour gauche et droite. Dans le listing de départ, le corps de votre tableau est déjà défini avec les balises et (facultatives). Avant ce corps, placez et border=1. Celui-ci indique que le tableau est affublé d'une bordure d'un pixel d'épaisseur (et, par là même, les cellules aussi). Changez la valeur, puis ajoutez d'autres attributs séparés par un espace : Ici bgcolor= lightyellow colorie le fond en jaune clair, bordercolordark=darkblue et bordercolorlight= lightblue créent un effet d'ombre. Passons à la largeur du tableau : , et entre les deux, inscrivez une ou plusieurs lignes pour titrer les colonnes de votre tableau (T1, T2...). Pour l'équivalent en bas de tableau (B1, B2...), utilisez les balises et , que vous placerez de préférence à la suite de . Pour que ces lignes d'en-tête soient directement en gras, remplacez les balises permettent de regrouper des lignes de mêmes caractéristiques. Ajoutez une balise avant la ligne 3 : les lignes suivantes seront alignées à droite et vont prendre une nouvelle couleur. en y ajoutant height =40%, et nous en Grouper les attributs par colonne et encadrer les groupes j TI T2 1 T3 T4 balise . Ces attributs sont valables pour toutes les cellules de ces 11 1 2 1:3 colonnes, sauf instruction contraire à l'intérieur d'une 1:4 cellule. Les colonnes 1 et 2 2.1 31 2:2 2:3 n'étant pas concernées, juste avant , placez deux balises 32 de suite. Puisque nous ne 4:1 précisons aucun attribut, ces dernières ne seront Bi B2 B3 1 B4 pas affectées. Une troisième balise s'adressera aux les mêmes attributs pour les colonnes 3 et 4. En effet, colonnes 3 et 4 à l'aide de la l'attribut span étend la portée des attributs à la colonne suivante. Ajoutez donc bgcolor=lightpink pour un fond rose clair et align=center afin que le contenu soit centré. Les colonnes définies par les balises peuvent ellesmêmes être groupées : de part et d'autre des deux premières balises , placez et . Faites la même chose pour la troisième balise. Maintenant, ajoutez rules=groups dans la balise
et
par . Plusieurs balises
Utiliser les styles Pour simplifier la démonstration, nous nous sommes ici servis des attributs classiques des balises. L'utilisation de styles est bien plus efficace : elle facilite l'homogénéisation et la modification des sites et offrent des possibilités supplémentaires. Dans les tableaux, on peut modifier la couleur du texte au niveau du tableau, d'un groupe, d'une ligne ou d'une cellule en précisant Style="color blue", par exemple, dans la balise adéquate. Sinon, il faudra placer une balise dans chaque cellule. En effet, les tableaux n'héritent pas des caractéristiques du texte du paragraphe les précédant ; de même, une cellule n'hérite pas de celles de la cellule précédente. dans le même esprit Connaître l'étendue des attributs Les balises reçoivent un nombre plus ou moins grand d'attributs, lesquels acceptent un nombre de valeurs variable suivant les cas. Pour en connaître l'étendue, il sera utile de consulter les références sur le Web. Les grands sites de référence sont généralement en anglais. Nous vous proposons de vous rendre sur All html (wvvw.allhtml.com/html/index.php, liste déroulante Index des balises) ou selfhtml (http://selfhtml.selfhtml.com.fr), assez complets et en français. Aux débutants anglophones, nous déconseillons le site de W3C (www.w3c.org), le consortium du Web, qui est par définition complet mais particulièrement mal fichu. Le site MSDN de Microsoft (http://msdn.microsoft.com/library/default.asp) est plutôt mieux fait, encore faut-il arriver à y naviguer. Etendre les cellules et modifier leur taille ou leur couleur Les cellules peuvent être étendues à plusieurs lignes et colonnes. Pour étendre la cellule 1:4 dans le sens vertical sur deux lignes, ajoutez rowspan=2 dans sa balise ad>. La cellule 3:2 sera étendue verticalement (sur 2 lignes) et horizontalement (sur 3 colonnes) : sa balise devient
. La cellule 3:2 occupe maintenant les emplacements 3:2, 3:3, 3:4, 4:2,4:3 et 4:4. Gare aux croisements qui donnent des résultats aléatoires (ce qui se serait produit si nous avions étendu la cellule 1:4 sur trois lignes). 1:1 1:2 1:3 21 2:2 13 31 4:1 32 14 Les largeurs de colonnes sont calculées "au mieux" par le navigateur en fonction du texte que contient chaque cellule. Bien que n'importe quelle cellule d'une colonne puisse en définir la largeur, utilisez la première ligne pour fixer la largeur d'une colonne (ce sera plus facile à relire). Ici, nous avons modifié la largeur de la deuxième colonne dans la cellule 1:2 : . Nous avons aussi modifié la balise de début de la deuxième ligne
et constatez que les encadrements des cellules concernent les groupes avons aussi profité pour changer la couleur de fond de toute la ligne (bgcolor= lightgreen), donc de chacune de ses cellules. Ces attributs sont aussi utilisables dans une cellule individuelle (balise
). Ils prendront le pas sur les attributs placés à un niveau plus général (table, colonne, ligne...). îcolgroup et tbody. Attention, toutefois, aux interférences entre les groupements par ligne ou par colonne et les cellules étendues ; les résultats sont difficilement prévisibles. T1 T2 T3 T4 1. 1 1:2 11 31 4.1 B1 B2 1 113 B4 3.2 Mars 2003 svni 149



Autres parutions de ce magazine  voir tous les numéros


Liens vers cette page
Couverture seule :


Couverture avec texte parution au-dessus :


Couverture avec texte parution en dessous :


SVM numéro 213 mars 2003 Page 1SVM numéro 213 mars 2003 Page 2-3SVM numéro 213 mars 2003 Page 4-5SVM numéro 213 mars 2003 Page 6-7SVM numéro 213 mars 2003 Page 8-9SVM numéro 213 mars 2003 Page 10-11SVM numéro 213 mars 2003 Page 12-13SVM numéro 213 mars 2003 Page 14-15SVM numéro 213 mars 2003 Page 16-17SVM numéro 213 mars 2003 Page 18-19SVM numéro 213 mars 2003 Page 20-21SVM numéro 213 mars 2003 Page 22-23SVM numéro 213 mars 2003 Page 24-25SVM numéro 213 mars 2003 Page 26-27SVM numéro 213 mars 2003 Page 28-29SVM numéro 213 mars 2003 Page 30-31SVM numéro 213 mars 2003 Page 32-33SVM numéro 213 mars 2003 Page 34-35SVM numéro 213 mars 2003 Page 36-37SVM numéro 213 mars 2003 Page 38-39SVM numéro 213 mars 2003 Page 40-41SVM numéro 213 mars 2003 Page 42-43SVM numéro 213 mars 2003 Page 44-45SVM numéro 213 mars 2003 Page 46-47SVM numéro 213 mars 2003 Page 48-49SVM numéro 213 mars 2003 Page 50-51SVM numéro 213 mars 2003 Page 52-53SVM numéro 213 mars 2003 Page 54-55SVM numéro 213 mars 2003 Page 56-57SVM numéro 213 mars 2003 Page 58-59SVM numéro 213 mars 2003 Page 60-61SVM numéro 213 mars 2003 Page 62-63SVM numéro 213 mars 2003 Page 64-65SVM numéro 213 mars 2003 Page 66-67SVM numéro 213 mars 2003 Page 68-69SVM numéro 213 mars 2003 Page 70-71SVM numéro 213 mars 2003 Page 72-73SVM numéro 213 mars 2003 Page 74-75SVM numéro 213 mars 2003 Page 76-77SVM numéro 213 mars 2003 Page 78-79SVM numéro 213 mars 2003 Page 80-81SVM numéro 213 mars 2003 Page 82-83SVM numéro 213 mars 2003 Page 84-85SVM numéro 213 mars 2003 Page 86-87SVM numéro 213 mars 2003 Page 88-89SVM numéro 213 mars 2003 Page 90-91SVM numéro 213 mars 2003 Page 92-93SVM numéro 213 mars 2003 Page 94-95SVM numéro 213 mars 2003 Page 96-97SVM numéro 213 mars 2003 Page 98-99SVM numéro 213 mars 2003 Page 100-101SVM numéro 213 mars 2003 Page 102-103SVM numéro 213 mars 2003 Page 104-105SVM numéro 213 mars 2003 Page 106-107SVM numéro 213 mars 2003 Page 108-109SVM numéro 213 mars 2003 Page 110-111SVM numéro 213 mars 2003 Page 112-113SVM numéro 213 mars 2003 Page 114-115SVM numéro 213 mars 2003 Page 116-117SVM numéro 213 mars 2003 Page 118-119SVM numéro 213 mars 2003 Page 120-121SVM numéro 213 mars 2003 Page 122-123SVM numéro 213 mars 2003 Page 124-125SVM numéro 213 mars 2003 Page 126-127SVM numéro 213 mars 2003 Page 128-129SVM numéro 213 mars 2003 Page 130-131SVM numéro 213 mars 2003 Page 132-133SVM numéro 213 mars 2003 Page 134-135SVM numéro 213 mars 2003 Page 136-137SVM numéro 213 mars 2003 Page 138-139SVM numéro 213 mars 2003 Page 140-141SVM numéro 213 mars 2003 Page 142-143SVM numéro 213 mars 2003 Page 144-145SVM numéro 213 mars 2003 Page 146-147SVM numéro 213 mars 2003 Page 148-149SVM numéro 213 mars 2003 Page 150-151SVM numéro 213 mars 2003 Page 152-153SVM numéro 213 mars 2003 Page 154-155SVM numéro 213 mars 2003 Page 156-157SVM numéro 213 mars 2003 Page 158-159SVM numéro 213 mars 2003 Page 160-161SVM numéro 213 mars 2003 Page 162-163SVM numéro 213 mars 2003 Page 164-165SVM numéro 213 mars 2003 Page 166