Réalisation d'un tableau

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Réalisation d'un tableau

Message par toulouse1914 le Sam 24 Sep 2011 - 15:38

Bonjour!
J'aimerais créer un tableau, comme ceci :

Cependant, je sais pas comment faire un tableau superposé ainsi. J'aimerais que les bords plus minces soient transparents, donc un tableau sans ''lignes'', sauf celle extérieure. Si c'est possible, j'aimerais bien que le tableau extérieur soit arrondi...

Merci!


Dernière édition par toulouse1914 le Dim 25 Sep 2011 - 19:58, édité 1 fois

toulouse1914
**

Féminin
Messages : 84
Inscrit(e) le : 12/10/2009

http://foreverstables.forumactif.com
toulouse1914 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par Narcismirk le Sam 24 Sep 2011 - 17:28

Bonjour !
Pour faire ce tableau, utilise ce code :

Code:
<table style="border:3px solid #000000; border-collapse:collapse;" border="0" width="300px">
   <tr>
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center" colspan="2">
Texte
      </td>
   </tr>
   
   <tr>
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
      
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
   </tr>
   
   <tr>
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
      
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
   </tr>
</table>

Dans ce code, je te l'ai laissé avec les bordures intérieures. Comme tu veux les enlever, tu dois supprimer dans les balises <td> le code border:1px solid #000000 ; ou bien tu remplaces le 1px par 0px.
Les cellules de ta première lignes sont fusionnées horizontalement. Pour faire cela, tu dois mettre colspan="nombredecellulesàfusionner" (ici 2) dans la balise <td> que tu désires modifier. Tu peux également le faire verticalement, grâce à rowspan="nombredecellulesàfusionner".

J'espère t'avoir aidé Very Happy

Cordialement,
A bientôt.

Narcismirk
Nouveau membre

Féminin
Messages : 29
Inscrit(e) le : 11/09/2011

http://pensionnat-cerberus.forumactif.fr/
Narcismirk a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par toulouse1914 le Dim 25 Sep 2011 - 0:16

Comment on fait pour agrandir ce tableau? ^^

EDIT : J'ai trouvé! Mais comment on fait pour donner au tableau une couleur de fond et qu'il soit centré? Car quand je poste ce tableau, il y a un gros blanc au dessus...


Dernière édition par toulouse1914 le Dim 25 Sep 2011 - 0:20, édité 1 fois

toulouse1914
**

Féminin
Messages : 84
Inscrit(e) le : 12/10/2009

http://foreverstables.forumactif.com
toulouse1914 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par Narcismirk le Dim 25 Sep 2011 - 0:19

Tu as juste à changer le nombre de pixels dans les attributs width et height à ta convenance Very Happy

Narcismirk
Nouveau membre

Féminin
Messages : 29
Inscrit(e) le : 11/09/2011

http://pensionnat-cerberus.forumactif.fr/
Narcismirk a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par toulouse1914 le Dim 25 Sep 2011 - 0:21

Oups, j'ai pas édité à temps... J'ai trouvé, mais il y a un gros blanc au dessus du tableau, et je n'arrive pas à le centrer. Comment on fait pour lui rajouter une couleur de fond? =)

toulouse1914
**

Féminin
Messages : 84
Inscrit(e) le : 12/10/2009

http://foreverstables.forumactif.com
toulouse1914 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par Narcismirk le Dim 25 Sep 2011 - 0:28

Pour le blanc au-dessus, je ne sais pas, ça ne me fait pas une telle chose :0

Pour le centrer, tu ajoutes align="center" dans la balise <table>

Pour la couleur de fond, tu ajoutes background-color:#COULEUR; à l'attribut style de la même balise.

Narcismirk
Nouveau membre

Féminin
Messages : 29
Inscrit(e) le : 11/09/2011

http://pensionnat-cerberus.forumactif.fr/
Narcismirk a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par toulouse1914 le Dim 25 Sep 2011 - 0:32

Pour le center c'est réglé, mais comment enlever le gros blanc au dessus?
http://alaska-dog-race.forumactif.com/t2-test-tableau-fiches#2


toulouse1914
**

Féminin
Messages : 84
Inscrit(e) le : 12/10/2009

http://foreverstables.forumactif.com
toulouse1914 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par Narcismirk le Dim 25 Sep 2011 - 0:36

AH ! J'ai compris pourquoi tu avais ce blanc, alors en fait, tu dois supprimer tous les sauts de lignes inutiles. Parce que comme c'est dans un message que tu as mis ton tableau, tu as le BBcode en plus. Et dedans, chaque saut de ligne compte.

Narcismirk
Nouveau membre

Féminin
Messages : 29
Inscrit(e) le : 11/09/2011

http://pensionnat-cerberus.forumactif.fr/
Narcismirk a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par toulouse1914 le Dim 25 Sep 2011 - 0:38

Code:
[center]<table style="border:3px solid #000000; border-collapse:collapse;" border="0" width="600px" align="center" background-color:#000000;>
  <tr>
      <td style="border:1px solid #000000; height:500px;" valign="top" align="center" colspan="2">
Texte
      </td>
  </tr>
 
  <tr>
      <td style="border:1px solid #000000; height:100px;" width=300px;" valign="top" align="center">
</span><span style="display: block; float: center; width: 250px; max-height: 200px; overflow: auto; padding: 4px;"><span style="display: block; text-align: center; font-family: arial black; letter-spacing: 2px; font-size: 25px; color: #e0e7eb; text-transform: uppercase;">Caractère</span>
texte texte texte texte </span>
</div>
      </td>
     
      <td style="border:1px solid #000000; height:300px;" valign="top" align="center">
Texte
      </td>
  </tr>
 
  <tr>
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
     
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
  </tr>
</table>[/center]

Voici mon code... Je n'ai aucun saut de ligne inutile, non? Et j'arrive pas à mettre la couleur (je suis tarée, je sais xD).

toulouse1914
**

Féminin
Messages : 84
Inscrit(e) le : 12/10/2009

http://foreverstables.forumactif.com
toulouse1914 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par Narcismirk le Dim 25 Sep 2011 - 0:50

Quand je veux dire les sauts de lignes inutiles, je voulais parler de ceux entre les balises. Fais plutôt comme ça :

Code:

[center]<table style="border:3px solid #000000; border-collapse:collapse; background-color:#000000;" border="0" width="600px" align="center"><tr><td style="border:1px solid #000000; height:500px;" valign="top" align="center" colspan="2">Texte
</td></tr><tr><td style="border:1px solid #000000; height:100px;" width=300px;" valign="top" align="center"></span><span style="display: block; float: center; width: 250px; max-height: 200px; overflow: auto; padding: 4px;"><span style="display: block; text-align: center; font-family: arial black; letter-spacing: 2px; font-size: 25px; color: #e0e7eb; text-transform: uppercase;">Caractère</span>texte texte texte texte </span></div></td> <td style="border:1px solid #000000; height:300px;" valign="top" align="center">Texte</td></tr><tr><td style="border:1px solid #000000; height:100px;" valign="top" align="center">Texte</td><td style="border:1px solid #000000; height:100px;" valign="top" align="center">Texte</td></tr></table>[/center]

Voilà. C'est compact, difficile à lire, mais c'est la seule manière que je connais pour enlever les espaces peu esthétiques =/

Pour la couleur de fond, si tu n'y es pas arrivé, c'est parce que tu n'avais pas correctement placé le code (pardonne moi, j'ai dû mal m'exprimer). Le background-color:#000000; doit absolument se trouver dans la balise style="", entre les guillemets. (Mais non, mais non, tu n'es pas folle Very Happy )

Narcismirk
Nouveau membre

Féminin
Messages : 29
Inscrit(e) le : 11/09/2011

http://pensionnat-cerberus.forumactif.fr/
Narcismirk a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par toulouse1914 le Dim 25 Sep 2011 - 0:54

Merci beaucoup!

toulouse1914
**

Féminin
Messages : 84
Inscrit(e) le : 12/10/2009

http://foreverstables.forumactif.com
toulouse1914 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par Narcismirk le Dim 25 Sep 2011 - 0:56

Je t'en prie Very Happy

Narcismirk
Nouveau membre

Féminin
Messages : 29
Inscrit(e) le : 11/09/2011

http://pensionnat-cerberus.forumactif.fr/
Narcismirk a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Réalisation d'un tableau

Message par Invité le Dim 25 Sep 2011 - 10:19

Bonjour,

Afin de faciliter la gestion des problèmes, si votre problème est résolu, pensez à :
  • éditer votre premier message,
  • cocher l'icône résolu
  • Et enregistrer en cliquant sur


Vous pouvez également remercier les personnes qui vous ont aidé, en cliquant sur le bouton

A bientôt sur ForumActif Smile

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum