Comment faire un tableau

[canele]

Détails techniques

Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://www.canelle56.org/forum

Description du problème

Bonjour,
J'aimerais faire un tableau sur ma page d'accueil
avec liens des sections cliquables de ce style

de ce style:

avec des bordures colorées et larges à savoir que je ne connais
rien comment procéder merci de votre aide.

[Neptunia]

Bonjour ^^


Vous pouvez déjà construirevotre tableau avec ce tutoriel :
Apprendre à faire un tableau

Une fois que vous aurez posté le code de votre tableau, on pourra vous montrer comment changer la couleur de fond ou comment créer des bordures.

---

Pour créer un lien hypertexte en html :

Code:

<a href="http://www.site.com/cible_du_lien">Texte du lien</a>

[canele]

merci,j'ai mis ça dites moi si c'est bon mais je n'ai pas de cadre autour!

[Neptunia]

Oui c'est bon, et c'est normal de ne pas avoir de bordure qui prennent par défaut la valeur de 0.

Pour rajouter une bordure, il suffit de remplacer :
<table>
par <table border="2"> (2 indique la largeur de bordure)

Pour placer une couleur de fond, il suffit de mettre un identifiant à la cellule concernée (id ou class) et de passer par la feuille de style CSS. Ou bien d'embarquer directement le style dans le code HTML.

Par exemple :

Code:

<table cellpadding="2" border="2">
   <tr>
      <td>Contenu A</td>
      <td style="background-color:#CCCCCC;">Contenu B</td>
   </tr>
   <tr>
      <td>Contenu C</td>
      <td>Contenu D</td>
   </tr>
</table>

[canele]

merci
si je comprends bien pour avoir une bordure large j'augmente
le chiffre : border="2"
et je mets la # de mon choix?

et les liens de direction je les mets ou?

[canele]

oups!ce n'est pas du tout ce que je veux
la couleur je la veux dans les bordures
pas dans le tableau

[Neptunia]

Désolée, j'avais vu l'image exemple avec des entêtes en couleur et étais partie sur la couleur de fond.

Peut-être comme ceci ?

Code:

<table cellpadding="2" border="2" style="border:2px solid #FF0000;">
      <tr>
        <td>Contenu A</td>
        <td><a href="https://www.forumactif.com/">Créer un forum</a></td>
      </tr>
      <tr>
        <td>Contenu C</td>
        <td>Contenu D</td>
      </tr>
  </table>

et les liens de direction je les mets ou?

De préférence dans les cellules du tableau, c'est à dire les balises td. Dans le code de ce message, j'ai placé un lien dans la cellule B

[canele]

ok !merci par contre ça ne mets pas les bordures
couleur et taille aux séparations comment faire

[Neptunia]

Dans ce cas on va passer par la feuille CSS

A ajouter dans la feuille de style CSS :

Code:

.machin td {
  border: 2px solid #FF0000;
  }

Le tableau HTML correspondant :

Code:

    <table cellpadding="2" class="machin">
          <tr>
            <td>Contenu A</td>
            <td><a href="https://www.forumactif.com/">Créer un forum</a></td>
          </tr>
          <tr>
            <td>Contenu C</td>
            <td>Contenu D</td>
          </tr>
      </table>

[canele]

afin de ne pas faire de bêtise je met ça ou?

[Neptunia]

Le code CSS à la fin de la feuille de style (PA/Affichage/Couleurs/Onglet Feuille de style)

Le code HTML là où vous souhaitez votre tableau (message forum, message de la page d'accueil, description de catégorie, template, widget, bref ! là où vous voulez)

[canele]

yes!bien que ce n'est pas tout à fait ça
car j'ai une séparation entre
mais bon ça ira,et si je veux coloriser
le fond j'ajoute quoi?
je le mets dans annonce page accueil.

[Neptunia]

Pour la couleur de fond, j'avais expliqué comment faire dès ma deuxième réponse dans le sujet.

[canele]

ok désolée oui c'est vrai
et si on veut rajouter des contenus
plutôt en largeur on mets quoi si
c'est possible bien sur
Merci de votre aide c'est sympa.

[Neptunia]

Une cellule = 1 <td> par ligne <tr> comme sur l'image exemple
Deux cellules = 2 <td> comme tout au long de ce sujet

Si vous voulez plus de cellules il suffit de mettre plus de <td> par ligne de tableau

[canele]

ok merci beaucoup pour votre aide
le sujet est clos