AccueilFAQRechercherS'enregistrerMembresGroupesConnexion

Partagez | 
 

 [TUTORIEL] Insérer un tableau

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
crapopabo
Hot Toys / Marvel
Hot Toys / Marvel


Nombre de messages : 6723
Date d'inscription : 20/07/2007

MessageSujet: [TUTORIEL] Insérer un tableau   Lun 18 Juil 2011 - 10:04



Nous allons voir comment créer et insérer un tableau dans un message. Cette fonction peut paraître rebutante mais c'est un outil de mise en forme qui risque de devenir très vite incontournable...!


Créer un tableau

  • Cliquer sur l'icône
  • Une nouvelle fenêtre apparaît
    La première case correspond au nombre de ligne, la seconde au nombre de colonne que vous souhaitez insérer dans votre tableau. Les icônes en dessous permettent d'ajouter des lignes et/ ou des colonnes dans un tableau existant. Mettons "3" dans chacune des cases. Nous allons obtenir le code suivant :

    Code:
    [table border="1"]
    [tr]
    [td] [/td][td] [/td][td] [/td]
    [/tr][tr]
    [td] [/td][td] [/td][td] [/td]
    [/tr][tr]
    [td] [/td][td] [/td][td] [/td]
    [/tr]
    [/table]

  • Pour plus de lisibilité, remettons certaines balises à la ligne ( à l'aide de la touche "entrée") :

    Code:
    [table border="1"]

    [tr]
    [td] [/td]
    [td] [/td]
    [td] [/td]
    [/tr]

    [tr]
    [td] [/td]
    [td] [/td]
    [td] [/td]
    [/tr]

    [tr]
    [td] [/td]
    [td] [/td]
    [td] [/td]
    [/tr]

    [/table]

    Il y a donc 3 couples de balises [tr][/tr] et 3x3 couples de balises [td][/td].
    [tr][/tr] = code pour une ligne
    [td][/td] = code pour une case. Quand ce code est inséré entre les balises [tr][/tr], cela correspond à une colonne.

  • Important : le contenu du tableau (texte, image, etc.) se place toujours entre les balises [td][/td]


Ajouter du contenu

  • A cette étape, le tableau ressemble à ceci :



  • Pour ajouter du contenu, il suffit simplement de le mettre entre les balises [td][/td] ! Ouf !
    Pour ajouter du contenu sur la deuxième ligne de la deuxième colonne, il faut repérer la deuxième balise [tr] (=début de la deuxième ligne) et placer le contenu entre le deuxième couple de balises [td][/td] :


    CONTENU

  • Important : il est possible de mettre en forme le contenu (gras, italique, centré, etc.). Le plus pratique, c'est de mettre en forme le contenu AVANT de le positionner (soit en copier-coller, soit en sélectionner-glisser) dans le tableau.

    Exemple :

    Orange CyanBlanc
    Rougeitalique gras
    barré souligné
    centré



Mise en forme du tableau

Il est possible de modifier certains éléments d'un tableau :



  • La bordure = le plus simple à modifier.
    Lorsque vous créez un tableau, vous avez l'information par défaut qui apparaît dans la première balise : [table border="1"]. Pour épaissir la bordure, il faut modifier sa taille (en pixel). Dans l'exemple suivant, [table border="50"]

    Orange CyanBlanc
    Rougeitalique gras
    barré souligné
    centré


  • L'espacement entre les cellules
    C'est le même principe que pour la bordure, à la différence qu'il est nécessaire d'ajouter le code dans la première balise cellspacing="0" = [table border="1" cellspacing="10"]. Ce qui donne avec une valeur à 10 :

    Orange CyanBlanc
    Rougeitalique gras
    barré souligné
    centré


  • Le centrage
    Comme pour l'espacement entre les cellules, le code spécifique doit être ajouté dans la première balise style="margin:auto" = [table border="1" style="margin"]. Ce qui donne :

    Orange CyanBlanc
    Rougeitalique gras
    barré souligné
    centré

  • Important : il n'est pas possible de coloriser le tableau ou de modifier la taille des cases parce que cela ne peut passer que par la feuille de style (CSS) du forum. La taille des cases s'ajuste à la taille du contenu. Pour insérer des images de façon homogène, il faut que ces images aient les mêmes dimensions.
    En revanche, il est possible de combiner les différents éléments de mise en forme dans la première balise : [table border="20" cellspacing="10" style="margin"]. Ce qui donne :



    Orange CyanBlanc
    Rougeitalique gras
    barré souligné
    centré


Astuce pour créer un tableau rapidement


Méthode de Crapounet = utilisation de EXCEL et WORD:
 
Méthode de crapopabo = utilisation du BLOC-NOTES et des raccourcis CLAVIER:
 

Revenir en haut Aller en bas
Voir le profil de l'utilisateur
 
[TUTORIEL] Insérer un tableau
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
COLLECT'ALL :: Tout à propos du FORUM :: Charte, règles du forum, staff-
Sauter vers: