10 août 2020, 18:26
Mettre en forme des tableaux
Bonjour à tous! Aujourd'hui j'aimerais vous présenter un petit tutoriel pour les tableaux, en attendant que Zachary Winslow mette à jour son tutoriel BBCode sur les tableaux. J'espère qu'à la fin de la lecture de ce sujet, vous arriverez à nous épater avec des tableaux tous plus impressionnants que les autres!
Tout d'abord, il faut savoir que les tableaux utilisent trois balises:
Passons dans le vif du sujet! si vous cliquez sur l'icône tableau (), ça vous fera apparaître ceci:
Il y a donc la balise table, qui définit le début et la fin du tableau; la balise tr, qui définit le début et la fin d'une ligne et la balise td, qui définit le début et la fin d'une cellule.
Si vous voulez faire un tableau à deux cellules et une seule ligne: il suffit donc de rajouter une balise td entre les balises tr, après la première série de balises td.
Rajoutons maintenant le texte à notre tableau! Si on souhaite par exemple par ce tableau définir une équipe pour un quelconque événement:
Cela vous donnera ceci:
Afin de rendre le tout plus joli on peut bien entendu utiliser les BBCodes normaux dans chaque cellule (gras, italique, ... ) Dans le cas présent je vais centrer le texte de chaque cellule, le mettre en couleur et le souligner.
Ce qui nous donnera ceci:
Si on a oublié une quelconque cellule dans notre ligne, pas de problème! on peut en rajouter après, comme ceci:
Ce qui nous donnera ceci:
C'est bien joli tout ça, mais maintenant on souhaite rajouter du contenu en dessous! Pour ça, deux techniques:
Ce qui nous donnera ceci:
Dans ces cinq nouvelles cellules on va mettre ce qu'on veut, comme ceci:
Ce qui nous donnera ceci:
Voilà pour l'explication générale du tableau. Il vous est possible de faire des choses plus complexes, comme ceci:
Ce qui donnera:
On ne peut pas réellement faire un tableau avec un nombre de cellule différent par ligne: En utilisant la manière qui semblerait habituelle, sous le reducio ci-dessous, il y a plusieurs bugs: par exemple, la balise center qui est sensé centrer les images ne fonctionne pas.
En revanche, on peut pallier à ce problème en imbriquant un tableau dans un autre tableau:
ce qui donnera:
Par la suite, votre imagination sera la seule limite! Créez des tableaux pour égayer votre fiche, vos posts et autres présentations & résolutions!
Pour vous faciliter la tâche, vous pouvez également vous servir de ce site qui créera lui-même un tableau selon les informations que vous indiquez ! N'oubliez pas de décocher la case 1st row is header car le site ne prend pas en compte le code de cette option !
Si vous souhaitez faire un tableau mais que vous n'y arrivez pas, venez me contecter, je vous aiderai dans la mesure de mes connaissances & des mes possibilités!
~~~~~~~~~~
~~~~~~~~~~
Tout d'abord, il faut savoir que les tableaux utilisent trois balises:
- La Balise table, qui définit le début et la fin du tableau.
- La Balise tr, qui définit les lignes du tableau.
- Enfin, la balise td, qui définit chaque cellule (case) du tableau.
~~~~~~~~~~
Passons dans le vif du sujet! si vous cliquez sur l'icône tableau (), ça vous fera apparaître ceci:
Code : Tout sélectionner
[table][tr][td][/td][/tr][/table]~~~~~~~~~~
Si vous voulez faire un tableau à deux cellules et une seule ligne: il suffit donc de rajouter une balise td entre les balises tr, après la première série de balises td.
Code : Tout sélectionner
[table][tr][td][/td][td][/td][/tr][/table]~~~~~~~~~~
Rajoutons maintenant le texte à notre tableau! Si on souhaite par exemple par ce tableau définir une équipe pour un quelconque événement:
Code : Tout sélectionner
[table][tr][td]Équipe 1[/td][td]Équipe 2[/td][/tr][/table]
Équipe 1 Équipe 2
~~~~~~~~~~
Afin de rendre le tout plus joli on peut bien entendu utiliser les BBCodes normaux dans chaque cellule (gras, italique, ... ) Dans le cas présent je vais centrer le texte de chaque cellule, le mettre en couleur et le souligner.
Code : Tout sélectionner
[table][tr][td][center][u][color=#0000FF]Équipe 1[/color][/u][/center][/td][td][center][u][color=#008000]Équipe 2[/color][/u][/center][/td][/tr][/table]On peut même ajouter quelques citations afin de rendre le tableau plus joli:
~~~~~~~~~~
Si on a oublié une quelconque cellule dans notre ligne, pas de problème! on peut en rajouter après, comme ceci:
Code : Tout sélectionner
[table][tr][td][b]Équipes:[/b][/td][td][quote][center][u][color=#0000FF]Équipe 1[/color][/u][/center][/quote][/td][td][quote][center][u][color=#008000]Équipe 2[/color][/u][/center][/quote][/td][[td][quote][center][u][color=#FFFF00]Équipe 3[/color][/u][/center][/quote][/td][td][quote][center][u][color=#FF4000]Équipe 4[/color][/u][/center][/quote][/td][/tr][/table]
Équipes:
~~~~~~~~~~
C'est bien joli tout ça, mais maintenant on souhaite rajouter du contenu en dessous! Pour ça, deux techniques:
- On saute des lignes dans la même cellule, comme ceci:
Code : Tout sélectionner
[table][tr][td][b]Équipes:[/b]
[b]Capacités:[/b][/td][td][quote][center][u][color=#0000FF]Équipe 1[/color][/u][/center][/quote]
Cette équipe peut jouer deux actions au lieu d'une.[/td][td][quote][center][u][color=#008000]Équipe 2[/color][/u][/center][/quote]
Cette équipe voit son nombre de points augmenter de 1,8 à chaque actions réussies[/td][td][quote][center][u][color=#FFFF00]Équipe 3[/color][/u][/center][/quote]
Cette équipe a ses points qui descendent moins vite que les autres[/td][td][quote][center][u][color=#FF4000]Équipe 4[/color][/u][/center][/quote]
Cette équipe est capable de forcer une équipe à activer sa capacité[/td][/tr][/table]
Équipes:
Capacités:
- Ou on rajoute une ligne, comme ceci:
Code : Tout sélectionner
[table][tr][td][b]Équipes:[/b][/td][td][quote][center][u][color=#0000FF]Équipe 1[/color][/u][/center][/quote][/td][td][quote][center][u][color=#008000]Équipe 2[/color][/u][/center][/quote][/td][td][quote][center][u][color=#FFFF00]Équipe 3[/color][/u][/center][/quote][/td][td][quote][center][u][color=#FF4000]Équipe 4[/color][/u][/center][/quote][/td][/tr][tr][td][/td][td][/td][td][/td][td][/td][/tr][/table]Code : Tout sélectionner
[table][tr][td][b]Équipes:[/b][/td][td][quote][center][u][color=#0000FF]Équipe 1[/color][/u][/center][/quote][/td][td][quote][center][u][color=#008000]Équipe 2[/color][/u][/center][/quote][/td][td][quote][center][u][color=#FFFF00]Équipe 3[/color][/u][/center][/quote][/td][td][quote][center][u][color=#FF4000]Équipe 4[/color][/u][/center][/quote][/td][/tr][tr][td][b]Capacités:[/b][/td][td]Cette équipe peut jouer deux actions au lieu d'une.[/td][td]Cette équipe voit son nombre de points augmenter de 1,8 à chaque actions réussies[/td][td]Cette équipe a ses points qui descendent moins vite que les autres[/td][td]Cette équipe est capable de forcer une équipe à activer sa capacité[/td][/tr][/table]On peut ensuite mettre le BBCode que l'on veut à chacune de ces cinq cellules: ici une justification et une citation.
Équipes: Capacités: Cette équipe peut jouer deux actions au lieu d'une. Cette équipe voit son nombre de points augmenter de 1,8 à chaque actions réussies Cette équipe a ses points qui descendent moins vite que les autres Cette équipe est capable de forcer une équipe à activer sa capacité
Équipes: Capacités:
~~~~~~~~~~
Voilà pour l'explication générale du tableau. Il vous est possible de faire des choses plus complexes, comme ceci:
Code : Tout sélectionner
[table][tr][td][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][/td][td][quote][u][color=#BF8000]Mael Chassin[/color][/u][/quote][quote][color=#0040FF]Troisième année[/color][/quote][quote][color=#BF8000]Poufsouffle[/color][/quote][/td][td][quote][/quote][quote][img]/images/upload/4gvpej1c4904.webp[/img][/quote][quote][/quote][/td][td][quote][color=#0040FF]Cursus Sciences[/color][/quote][quote][color=#BF8000]Dublin[/color][/quote][quote][color=#0040FF]Irlandais[/color][/quote][/td][td][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][quote][/quote][/td][/tr][/table]
~~~~~~~~~~
On ne peut pas réellement faire un tableau avec un nombre de cellule différent par ligne: En utilisant la manière qui semblerait habituelle, sous le reducio ci-dessous, il y a plusieurs bugs: par exemple, la balise center qui est sensé centrer les images ne fonctionne pas.
Reducio
ce qui donnera:
Code : Tout sélectionner
[table][tr][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][/tr][tr][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][/tr][tr][td][center][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/center][/td][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][/tr][/table]En revanche, on peut pallier à ce problème en imbriquant un tableau dans un autre tableau:
Code : Tout sélectionner
[table][tr][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][/tr][tr][td][table][tr][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][/tr][/table][/td][/tr][tr][td][table][tr][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][td][center][img]/images/upload/jfvovvd2sxwo.webp[/img][/center][/td][/tr][/table][/td][/tr][/table] | |||
| |||
|
~~~~~~~~~~
Par la suite, votre imagination sera la seule limite! Créez des tableaux pour égayer votre fiche, vos posts et autres présentations & résolutions!
Pour vous faciliter la tâche, vous pouvez également vous servir de ce site qui créera lui-même un tableau selon les informations que vous indiquez ! N'oubliez pas de décocher la case 1st row is header car le site ne prend pas en compte le code de cette option !
Si vous souhaitez faire un tableau mais que vous n'y arrivez pas, venez me contecter, je vous aiderai dans la mesure de mes connaissances & des mes possibilités!
Dernière modification par Mael Chassin le 6 juil. 2021, 15:55, modifié 4 fois.
deuxième joueur du Royaume-Uni aux échecs sorciers
12 févr. 2021, 22:47
Mettre en forme des tableaux
MàJ du 12/02/21 sur l'onglet "nombre différent de cellule par ligne"
deuxième joueur du Royaume-Uni aux échecs sorciers