Recherche une propriété CSS/CSS3 Pour tableau

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

Résolu Recherche une propriété CSS/CSS3 Pour tableau

Message par Offrande le Dim 20 Oct 2013 - 2:17

Bonjour, 

Je suis en ce moment à la recherche d'une propriété CSS/CSS3 Pour créer plusieurs tableaux sur mon forum. Voila, 

Je recherche une propriété qui me permettrais de définir 2 fond de cellule (imaginons que le tableau ne comporte que des lignes horizontal..) 

J'aimerais que par exemple, 
la première ligne soir en rouge
puis la deuxième en bleu
puis la troisième en rouge
la quatrième en bleu
etc... sens devoir attribuer une par une la couleur de toutes mes cellules, 
je souhaiterais une propriété qui le fasse automatiquement

est ce qu'il en existe une ? 

Merci beaucoup de votre aide, je vous souhaite une magnifique nuit.

Tendrement.


Dernière édition par Offrande le Mer 30 Oct 2013 - 3:47, édité 1 fois

Offrande
*****

Féminin
Messages : 550
Inscrit(e) le : 05/01/2013

http://le-grand-havre.forumactif.org/
Offrande a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Recherche une propriété CSS/CSS3 Pour tableau

Message par Tech le Dim 20 Oct 2013 - 11:31

Bonjour,

Il est possible en mettant une class à la balise <table> du genre <table class="tableau"> d'utiliser un CSS du genre :
Code:
/* on met toutes les lignes en rouge */
.tableau tr {
  background: red;
}

/* on force une ligne sur 2 à se mettre en bleue */
.tableau tr:nth-child(2n) {
  background: blue!important;
}

Cordialement.



{ Règles Générales } { Question & Réponses Fréquentes } { Le Staff de ForumActif }

Tech
Modéractif
Modéractif

Masculin
Messages : 21125
Inscrit(e) le : 01/12/2007

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

Résolu Re: Recherche une propriété CSS/CSS3 Pour tableau

Message par Offrande le Dim 20 Oct 2013 - 18:06

Bonjour, 

Merci de t'as réponse Tech, 
je vais essayer ce petit bout de code de suite; je reviens pour t'en dire des nouvelles.

Je te souhaite une bonne soirée 

(Sujet pas encore résolue/merci.)

Tendrement. Smile

Offrande
*****

Féminin
Messages : 550
Inscrit(e) le : 05/01/2013

http://le-grand-havre.forumactif.org/
Offrande a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Recherche une propriété CSS/CSS3 Pour tableau

Message par Offrande le Mar 22 Oct 2013 - 15:40

Bonjour, 

J'ai essayer de placer cette propriété mais je n'ai pas sus le faire, imaginons que j'ai un tableau avec seulement des ligne, je suis doit mettre une class au tableau non? Si oui comment faire. Merci Smile

Offrande
*****

Féminin
Messages : 550
Inscrit(e) le : 05/01/2013

http://le-grand-havre.forumactif.org/
Offrande a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Recherche une propriété CSS/CSS3 Pour tableau

Message par HeleneM le Mar 22 Oct 2013 - 15:54

Bonjour pour mettre une classe au tableau c'est simple, comme l'a dit Tech :
Code:
<table class="NOM_DE_LA_CLASSE"><tr><td></td></tr></table>

HeleneM
***

Féminin
Messages : 170
Inscrit(e) le : 30/07/2011

http://enviedechangements.forumactif.org/
HeleneM a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Recherche une propriété CSS/CSS3 Pour tableau

Message par Scoubifitz le Sam 26 Oct 2013 - 7:14

bonjour,

pas mieux , à part un exemple concret :

Code:
<style>.tableau {width: 300px;}.tableau tr {background: red;text-align:center;color:white;}.tableau tr:nth-child(2n) {background: blue;}</style>
<table class="tableau">
<tr><td>1</td></tr>
<tr><td>2</td></tr>
<tr><td>3</td></tr>
<tr><td>4</td></tr>
<tr><td>5</td></tr>
<tr><td>6</td></tr>
<tr><td>7</td></tr>
</table>

Scoubifitz
+ Hyperactif +

Masculin
Messages : 3539
Inscrit(e) le : 18/03/2008

http://scoubidous.superforum.fr/
Scoubifitz a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Recherche une propriété CSS/CSS3 Pour tableau

Message par Offrande le Mar 29 Oct 2013 - 1:16

Shimi a écrit:Bonjour pour mettre une classe au tableau c'est simple, comme l'a dit Tech :
Code:
<table class="NOM_DE_LA_CLASSE"><tr><td></td></tr></table>
Merci pour t'as réponse Shimi ! I love you 


@Scoubifitz a écrit:bonjour,

pas mieux , à part un exemple concret :

Code:
[font=Verdana, Arial, Helvetica, sans-serif]<style>.tableau {width: 300px;}.tableau tr {background: red;text-align:center;color:white;}.tableau tr:nth-child(2n) {background: blue;}</style>[/font]
<table class="tableau">
<tr><td>1</td></tr>
<tr><td>2</td></tr>
<tr><td>3</td></tr>
<tr><td>4</td></tr>
<tr><td>5</td></tr>
<tr><td>6</td></tr>
<tr><td>7</td></tr>
</table>
Merci pour cette indication, je ne suis pas très douée en tableau (il faudrait vraiment que je pense a prendre quelque cours la dessus...) Je ne comprend pas pourquoi nous avons besoin de mettre un <style> au tableau si celui-ci porte une class? Pourquoi ne pas tout mettre dans la CSS grâce à la class tout simplement ? ^^

Merci beaucoup de vos réponse. I love you vous êtes adorable.

Offrande
*****

Féminin
Messages : 550
Inscrit(e) le : 05/01/2013

http://le-grand-havre.forumactif.org/
Offrande a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Recherche une propriété CSS/CSS3 Pour tableau

Message par Scoubifitz le Mar 29 Oct 2013 - 4:04

Le style que j'ai placé dans le code est pour avoir une vue directe du tableau dans un message , sans passer par le panneau admin .

Code:
<style>.tableau {width: 300px;}.tableau tr {background: red;text-align:center;color:white;}.tableau tr:nth-child(2n) {background: blue;}</style>
Ce style peut être mis dans la feuille de style CSS du forum :

Code:
/* largeur du tableau */
.tableau {
width: 300px;
}
/* toutes les lignes du tableau sont rouges - texte blanc et centré */
.tableau tr {
background: red;
text-align:center;
color:white;
}
/* une ligne sur deux sera bleue */
.tableau tr:nth-child(2n) {
background: blue;
}

Scoubifitz
+ Hyperactif +

Masculin
Messages : 3539
Inscrit(e) le : 18/03/2008

http://scoubidous.superforum.fr/
Scoubifitz a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Recherche une propriété CSS/CSS3 Pour tableau

Message par Offrande le Mar 29 Oct 2013 - 4:28

D'accord, merci beaucoup, 

J'ai tenter pour le moment de faire un tableau simple mais je rencontre un gros problème que j'ai poster ici. Décidément, je ne suis vraiment pas douée question tableau .. :/ 

Passe une agréable Nuit Very Happy

Offrande
*****

Féminin
Messages : 550
Inscrit(e) le : 05/01/2013

http://le-grand-havre.forumactif.org/
Offrande a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Recherche une propriété CSS/CSS3 Pour tableau

Message par Tech le Mar 29 Oct 2013 - 21:56

Bonsoir,

En général, il vaut mieux ne pas mélanger inutilement du BBCode et du HTML, ce sont 2 langages utilisés séparément, c'est donc mieux de n'en utiliser qu'un seul.

Ensuite vous oubliez souvent de délimiter les attributs via les " ", cela peut porter à confusion à certains moments. Il vaut donc mieux mettre class="..." que class=...

Donc soit on utilise du HTML ce qui donne :
Code:
<table class="tableau"><tr>
<td>...</td><td>...</td>
</tr><tr>
<td>...</td><td>...</td>
</tr></table>
où chaque <tr>...</tr> représente une ligne d'un tableau et chaque <td>...</td> représente une colonne dans la ligne tr.

ou on peut utiliser du BBCode ce qui revient un peu au même :
Code:
[table][tr]
[td]...[/td][td]...[/td]
[/tr][tr]
[td]...[/td][td]...[/td]
[/tr][/table]

Cordialement.



{ Règles Générales } { Question & Réponses Fréquentes } { Le Staff de ForumActif }

Tech
Modéractif
Modéractif

Masculin
Messages : 21125
Inscrit(e) le : 01/12/2007

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

Résolu Re: Recherche une propriété CSS/CSS3 Pour tableau

Message par Offrande le Mer 30 Oct 2013 - 3:47

Bonjour et merci beaucoup pour t'as réponse Smile 

J'ai tout ce qu'il me faut maintenant, je met le sujet en résolus, encore une fois merci <3 !

Bonne journée Smile

Offrande
*****

Féminin
Messages : 550
Inscrit(e) le : 05/01/2013

http://le-grand-havre.forumactif.org/
Offrande 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