2 avr. 2014

TECH-CRE Secrétariat 27|02

TECH-CRE > Secrétariat de cours


RE-CAP


27|02|14


HTML /Merci Nicolas !


Les tableaux

Les NEWSLETTERS fonctionnent avec des tableaux. « 

TD, TR, TH = balises de tableaux.

Pourquoi ?

Afin d’assurer la lecture des contenus car les navigateurs n’affichent pas tous les codes de la même manière.
De plus, la Newsletter … CSS intégré
Il existe des sites des plateformes comme MAILCHIMP qui offrent la possibilité d’une large palette de templates gratuits en ligne.

Comment ça marche les tableaux ?

Par ligne et par cellules :
Les lignes sont écrites <TR> et représentent la ligne dans toute sa longueur (horizontale).
Les cellules sont écrites <TD> et représentent le découpage de la ligne à la verticale.

Pour que le code soit correct, il faut commencer par annoncer la création d’un tableau <TABLE> (la refermer </TABLE>)
Débutons par un tableau simple :
<TABLE>
<TR>
<TD>
</TD>
<TD>
</TD>
</TR>
</TABLE>

Application : réaliser un tableau de valeurs Héxa
<TD bgcolor = red></TD>

Exemples (Maxime et Mélina) :

Nom des couleursCouleursRVBhexa
Orange2551280#FF8000
Bleu100200180#64C8B4
Vert20250112#14FA70
Violet fonce1050100#0A3264
Bleu vert12224136#0CE088
Rose24032108#F0206C

Noms des couleurs : CouleursRVBhexa
Rouge cramoisi16088#A00808
Bleu marine2876130#1C4C82
Jaune poussin24723924#F7EF18
Rose barbie24724234#F718ea
Rose barbie185238142#B9EE8E



CSS intégré > Comment modifier les attributs ?
Les attributs se placent à l’intérieur de la blaise :
Border = «» épaisseur du cadre
bgcolor = «» couleur de la cellule ou de la ligne
height = …px hauteur
width = … px Largeur
align = left, right, center (align à l’intérieur du tableau).
cellpadding = «» = espace entre le bord et le contenu
cellspacing = «» = taille de la bordure entre les cellules

On peut également intervenir sur la structure du tableau (principalement pour la rendre invisible).
Exp, VOID signifie pas de cadre
<TABLE FRAME = « void » border = « 2 »>
None = aucun
Cols = entre les colonnes
Rows = entre les lignes
Alls = de partout


Changer les polices / tailles :


<td><font face=« arial » size=2>



"SPACE INVADER CONTEST"
Alors ? C'est qui le plus beau ?!


1 - Mickael C.:

SPACE INVADERS ARE BACK


2 - Mélina :



__
..







3 - Maxime :


4 - Juliette :


AA
AA
AA
oAAAA
AAAA
AAAA
AAAAAA


5 - Samantha :


Aucun commentaire:

Enregistrer un commentaire