Forum d'entraide PHPFrance

bonjour a tous,

J'ai un fichier PHP qui affiche les données d'une tables SQL, le tous s'affiche dans un tableau.
Cependant je souhaiterai changer cela et faire apparaitre chaque donnée dans un fond.
Exemple :
premier ligne de donnée s'affiche dans le fond 1
deuxième ligne de donnée s'affiche dans un autre fond1 mit juste en dessous de celle ci
troisième ligne de donnée s'affiche en dessous de la ligne 3 dans un autre fond.
etc...

pour cela dans mon fichier PHP qui affiche les donnée j'ai placé cela.

<?php
$sql= 'SELECT * FROM annonces WHERE 1';
$req= mysql_query($sql) or die ('erreur sql §<br />'.$sql.'<br />'.mysql_error());

//Ta boucle
$i=0;

while($data=mysql_fetch_array($req)) 
  { // ici la boucle qui permet d'effectuer la recherche 
  ?>
 <tr class="<?php echo ($i%2) ? 'classedufond2' : 'classedufond1'; ?>">
    <td><?php echo $data ['departement']; ?></td>
	<td><?php echo $data ['region']; ?></td>
	<td><?php echo $data ['categorie']; ?></td>
	<td><?php echo $data ['souscategorie']; ?></td>	
    <td><?php echo $data ['typeannonce']; ?></td>
	<td><?php echo $data ['titreannonce']; ?></td>
    <td><?php echo $data ['descriptionannonce']; ?></td>
	<td><?php echo $data ['prix'].'<br /><br />'; ?></td>
  </tr>
 <?php
    $i++;
?>

Puis dans mon fichier CSS j'ai placé cela.

Code : Tout sélectionner

classedufond1
{
	width: 400px;
	height: 200px;
	position: absolute;
	top: 140px;
	left: 160px;
	font-family: arial;
	background: url("../contenu/petite_annonce") no-repeat;
	
	
}
classedufond2
{
	width: 400px;
	height: 200px;
	position: absolute;
	top: 340px;
	left: 160px;
	font-family: arial;
	background: url("../contenu/petite_annonce") no-repeat;
	
	
}

mais rien n'apparait, je trouve pas mon problème

pourriez vous m'aider merci d'avance

Bonjour à toi,

Moi, la première chose qui m'a sautée aux yeux, c'est que tu ne fermes pas ta boucle while.
Anyway, je suppose que tu ne nous as pas mis tout le code exprès

Et deuxièmement, la propriété CSS pour mettre le background ne devrait pas plutôt se présenter comme ceci?

Code : Tout sélectionner

classedufondX
{
   width: 400px;
   height: 200px;
   position: absolute;
   top: 140px;
   left: 160px;
   font-family: arial;
   background-image: url("images/fond.png"); no-repeat;  
}

Donc en gros background-image: au lieu de background: tout court?

Voila, essaye comme ceci et dit nous si c'est ok, sinon, reviens nous voir ^^

Le mieux est de renseigner le chemin à partir de la racine de ton site avec juste un slash avant:
Le chemin absolu donc.

Exemple (si le dossier images se trouve à la racine du site):

Code : Tout sélectionner

/images/fond.png

Perso je ne mets pas de guillemets, donc:

Code : Tout sélectionner

url(/images/fond.png) no-repeat;

cela marche comme sa :

Code : Tout sélectionner

.classedufond1
{
	width: 400px;
	height: 200px;
	position: absolute;
	top: 140px;
	left: 160px;
	font-family: arial;
	background: url(/contenu/petite_annonce.png) no-repeat;
	
	
}
.classedufond2
{
	width: 400px;
	height: 200px;
	position: absolute;
	top: 340px;
	left: 160px;
	font-family: arial;
	background: url(/contenu/petite_annonce.png) no-repeat;
	
	
}

mais comment je peut faire pour qu'a chaque annonce passé ( chaque ligne de mon tableau ) apparaissent dans chaque fond séparément.

 <tr class="<?php echo ($i%2) ? 'classedufond2' : 'classedufond1'; ?>">
    <td><?php echo $data ['departement']; ?></td>
        <td><?php echo $data ['region']; ?></td>
        <td><?php echo $data ['categorie']; ?></td>

Si j'ai bien compris:
Ta boucle est censée changer de class css le <tr> qui lui même contient chaque ligne (<td>) d'une même annonce.

Dans le même principe:
Si tu veux changer de class css chaque ligne d'un annonce, alors faudra changer la class css de chaque <td> .
Donc le background de chaque lignes (<td> ).
Faudra donc, par exemple, créer deux autres class, avec un backgound différent.
Et ensuite modifier ta boucle en conséquence...

Enfin si j'ai bien compris ta question?

je te donne un exemple
premier annonces, j'ai une image de fond et sur cette image j'ai la premier annonce qui comprend tout les TD.

pour la deuxième annonce j'ai anouveau la même image de fond comportant toutes les données mais celle ci va se trouver en dessous de la première.

puis a chaque nouvelle annonce le fond apparait et s'incrémente toujours en dessous de la précedente

Le plus simple c'est de poster le code complet et non un bout de code avec une boucle non complète et même pas fermée (par une accolade) ...
On est obligé d'imaginer quelle est bien fermée et il est difficile de deviner ce qui peut se trouver à la suite...

Ensuite expliquer clairement ce qui te dérange dans le résultat que tu obtiens, puis ensuite le résultat que tu aimerais obtenir...
Avec éventuellement un petit exemple trouvé sur le net

Sinon:
faq-tutoriels/nombre-colonnes-dynamique ... 41626.html

d'accord je comprend voici le code de ma page PHP.

<?php
$base = mysql_connect ('aaaa','aaaa','aaaa');
mysql_select_db ('aaaa', $base);
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head> 
 <title>petite annonce gratuite pour particulier encart publicitaire pour profesionnel - mon espace</title>
 <meta http-equiv="Content-Type" content="text/html";
	charset=iso-8859-1" />
 <link rel="stylesheet" media="screen" type="text/css"
	title="Design espace" href="css/annonces2_style.css" />
</head>
<body>
<div id="annonce"></div>
	

	<div id="entete">
 
	</div>

	<div id="corps">
 
		<img src="contenu/logisdesannonces.png" alt="logisdesannonces" class="logisdesannonces" />
		<img src="contenu/logo.png" alt="logo" class="logo" />
	<div id="bouton">		
		<a href="divers.html"><img src="contenu/divers.png" alt="divers" class="divers" border="0"/></a>
		<a href="vehicule.html"><img src="contenu/vehicule.png" alt="vehicule" class="vehicule" border="0"/></a>
		<a href="hightech.html"><img src="contenu/high-tech.png" alt="hightech" class="hightech" border="0"/></a>
		<a href="immobilier.html"><img src="contenu/immobilier.png" alt="immobilier" class="immobilier" border="0"/></a>
		<a href="animaux.html"><img src="contenu/animaux.png" alt="animaux" class="animaux" border="0"/></a>
		<a href="espacepro.html"><img src="contenu/boutonpro.png" alt="bouton" class="bouton" border="0"/></a>
	</div>	
		<a href="http://www.logisdesannonces.fr/accueil.html"><img src="contenu/bouton_accueil.png" alt="accueil" class="accueil" border="0"/></a>

	</div>


<table> <!-- Début du tableau -->
  
 
<?php
$sql= 'SELECT * FROM annonces WHERE 1';
$req= mysql_query($sql) or die ('erreur sql §<br />'.$sql.'<br />'.mysql_error());

//Ta boucle
$i=0;

while($data=mysql_fetch_array($req)) 
  { // ici la boucle qui permet d'effectuer la recherche 
  ?>
 <tr class="<?php echo ($i%2) ? 'classedufond2' : 'classedufond1'; ?>">
    <td><?php echo $data ['departement']; ?></td>
	<td><?php echo $data ['region']; ?></td>
	<td><?php echo $data ['categorie']; ?></td>
	<td><?php echo $data ['souscategorie']; ?></td>	
    <td><?php echo $data ['typeannonce']; ?></td>
	<td><?php echo $data ['titreannonce']; ?></td>
    <td><?php echo $data ['descriptionannonce']; ?></td>
	<td><?php echo $data ['prix'].'<br /><br />'; ?></td>
  </tr>
 <?php
    $i++;
?>
    
<?php
  }
 mysql_free_result ($req);
mysql_close ();
  ?>
</table>

</div>

<div id="pied_de_page">
 <div id="boutonbas">
	<a href="information.html"><img src="contenu/information.png" alt="information" class="information" border="0"/></a>
	<a href="contact.html"><img src="contenu/contact.png" alt="contact" class="contact" border="0"/></a>
	<a href="newsletters.html"><img src="contenu/newsletters.png" alt="newsletters" class="newsletters" border="0"/></a>
	<a href="offre.html"><img src="contenu/offre.png" alt="offre" class="offre" border="0"/></a>
	<a href="aide.html"><img src="contenu/aide.png" alt="aide" class="aide" border="0"/></a>

</div>
</div>


</body>
</html>

et voici mon code CSS

Code : Tout sélectionner

body
 {
	color: black;
	background-color: #CBCBCB;	
}

#entete
{
	width: 1024px;
	height: 200px;
	position: absolute;
	top: 90px;
	left: 90px;
	
	background: url("../contenu/barre.png") no-repeat;	
}




div#entete 
{  
   color:white;
   font-size:15px;
   font-family: arial;
   
}


#h2
{
   
	position: absolute;
	top: 100px;
	left: 200px;
	font-size:13px;
    font-family: arial;
	color:white;
}

.logisdesannonces
{
	position: absolute;
	top: 30px;
	left: 210px;
}

.accueil
{
	position: absolute;
	top: 79px;
	left: 100px;
}


.logo
{
	position: absolute;
	top: -20px;
	left: 90px;
}

#bouton
{
	width: 1024px;
	height: 200px;
	position: absolute;
	top: 0px;
	left: 160px;	
	border: 0px;
}


.divers
{
	position: absolute;
	top: 79px;
	left: 102px;
	border: 0px;
}
.vehicule
{
	position: absolute;
	top: 79px;
	left: 240px;
	border: 0px;
}
.hightech
{
	position: absolute;
	top: 79px;
	left: 378px;
	border: 0px;
}
.immobilier
{
	position: absolute;
	top: 79px;
	left: 516px;
	border: 0px;
}
.animaux
{
	position: absolute;
	top: 79px;
	left: 654px;
	border: 0px;
}
.bouton
{
	position: absolute;
	top: 30px;
	left: 580px;
	border: 0px;
}

.classedufond1
{
	width: 400px;
	height: 200px;
	position: absolute;
	top: 140px;
	left: 160px;
	font-family: arial;
	background: url(/contenu/petite_annonce.png) no-repeat;
	
	
}
.classedufond2
{
	width: 400px;
	height: 200px;
	position: absolute;
	top: 340px;
	left: 160px;
	font-family: arial;
	background: url(/contenu/petite_annonce.png) no-repeat;
	
	
}




#pied_de_page
{
	width: 1024px;
	height: 200px;
	position: absolute;
	top: 780px;
	left: 90px;
	
	background: url("../contenu/barre.png") no-repeat;	
}

#boutonbas
{
	width: 1024px;
	height: 200px;
	position: absolute;
	top: 0px;
	left: 160px;	
	border: 0px;
}
.information
{
	position: absolute;
	top: -10px;
	left: 10px;
	border: 0px;
}
.contact
{
	position: absolute;
	top: -10px;
	left: 150px;
	border: 0px;
}
.offre
{
	position: absolute;
	top: -10px;
	left: 290px;
	border: 0px;
}
.newsletters
{
	position: absolute;
	top: -10px;
	left: 430px;
	border: 0px;
}
.aide
{
	position: absolute;
	top: -10px;
	left: 570px;
	border: 0px;
}

Donc comme je les dit je souhaiterai mettre une image rectangulaire en fond de chaque annonces.
Voici un exemplehttp://www.logisdesannonces.fr/exemple.jpg
Comme tu peut le constater il y a un fond blanc sous chaque annonce, chaque annonce reviens a la ligne et un autre fond blanc apparait je souhaite faire la meme chose a chaque annonce présente le fond apparait avec le titre la description ....
J'espère être plus explicite en tous cas merci de votre aide car pour la disposition je bloc un peut

Ok regarde ces liens:
http://a-pellegrini.developpez.com/tuto ... eaux/#LIII
http://www.zonecss.fr/style_css/feuille ... splay.html
http://www.aidenet.com/css/css40a.htm
http://www.aidenet.com/css/css42.htm

Tout en regardant aussi le lien que je t'ai donné plus haut

Et test en simplifiant tes 2 class dans un premier temps:

Code : Tout sélectionner

.classedufond1
{
   width: 400px;
   height: 200px;
   font-family: arial;
   background-color: white;
}

.classedufond2
{
   width: 400px;
   height: 200px;
   font-family: arial;
   background-color: lavender;
}

Ensuite dés que le résultat te convient, mets les backgrounds que tu désires...

j'ai regardé les liens que tu ma envoyer mais j'ai déja utilisé cela regarde dans mon tableau

http://www.logisdesannonces.fr/annonces.php

Supposant que je n'utilise pas de fond, et qu'on parte sur des tableaux je souhaiterai qu'a chaque annonce poster exemple si j'en est 5, chaques annonces sera présentées dans un tableau diffèrent, pas comme actuellement si tu regarde le liens tous est dans un seul tableau avec plusieurs lignes ( une annonce égale un tableau, a la deuxiéme annonce un deuxième tableau se crée juste en dessous etc...)
Comprend tu se que je souhaite de faire puis après quand j'aurai réussi cela a se moment la je pourrai ajouter un fond et voir comment il pourrait se répéter A la place du tableau le fond apparaitra)
c'est pas évident a expliquer mais j'espère que tu vois ce que je veut dire.
Encore merci pour ton aide

Je ne suis pas certain que tu es véritablement pris le temps de te documenter.
Sinon pour créer un tableau pour chaque annonce:
Mets les balises <table> et </table> à l'intérieur de ta boucle
En ajoutant, par exemple un margin pour les séparer, et le tour est joué.

le problème j'avais déja essayé ce faire cela

<table> <!-- Début du tableau -->
  
 
<?php
$sql= 'SELECT * FROM annonces WHERE 1';
$req= mysql_query($sql) or die ('erreur sql §<br />'.$sql.'<br />'.mysql_error());

//Ta boucle
$i=0;

while($data=mysql_fetch_array($req)) 
  { // ici la boucle qui permet d'effectuer la recherche 
  ?>
 <tr class="<?php echo ($i%2) ? 'classedufond2' : 'classedufond1'; ?>">
 <table>
    <td><?php echo $data ['departement']; ?></td>
	<td><?php echo $data ['region']; ?></td>
	<td><?php echo $data ['categorie']; ?></td>
	<td><?php echo $data ['souscategorie']; ?></td>	
    <td><?php echo $data ['typeannonce']; ?></td>
	<td><?php echo $data ['titreannonce']; ?></td>
    <td><?php echo $data ['descriptionannonce']; ?></td>
	<td><?php echo $data ['prix'].'<br /><br />'; ?></td>
</table>
  </tr>
 <?php
    $i++;
?>
    
<?php
  }
 mysql_free_result ($req);
mysql_close ();
  ?>
</table>

mais le HIC cela donne sa http://www.logisdesannonces.fr/an.php

Et le début du tableau est ou?
En dehors de la boucle ou dedans?

Code : Tout sélectionner

<table> 

Désolé voici le code complet faut que j'arrête de donner des bout de code

<?php
$base = mysql_connect ('aaaa,'laaa','aaa');
mysql_select_db ('aaa', $base);
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head> 
 <title>petite annonce gratuite pour particulier encart publicitaire pour profesionnel - mon espace</title>
 <meta http-equiv="Content-Type" content="text/html";
	charset=iso-8859-1" />
 <link rel="stylesheet" media="screen" type="text/css"
	title="Design espace" href="css/annonces_style.css" />
</head>
<body>
<div id="annonce"></div>
	

	<div id="entete">
 
	</div>

	<div id="corps">
 
		<img src="contenu/logisdesannonces.png" alt="logisdesannonces" class="logisdesannonces" />
		<img src="contenu/logo.png" alt="logo" class="logo" />
	<div id="bouton">		
		<a href="divers.html"><img src="contenu/divers.png" alt="divers" class="divers" border="0"/></a>
		<a href="vehicule.html"><img src="contenu/vehicule.png" alt="vehicule" class="vehicule" border="0"/></a>
		<a href="hightech.html"><img src="contenu/high-tech.png" alt="hightech" class="hightech" border="0"/></a>
		<a href="immobilier.html"><img src="contenu/immobilier.png" alt="immobilier" class="immobilier" border="0"/></a>
		<a href="animaux.html"><img src="contenu/animaux.png" alt="animaux" class="animaux" border="0"/></a>
		<a href="espacepro.html"><img src="contenu/boutonpro.png" alt="bouton" class="bouton" border="0"/></a>
	</div>	
		<a href="http://www.logisdesannonces.fr/accueil.html"><img src="contenu/bouton_accueil.png" alt="accueil" class="accueil" border="0"/></a>

	</div>


<table> <!-- Début du tableau -->
  
 
<?php
$sql= 'SELECT * FROM annonces WHERE 1';
$req= mysql_query($sql) or die ('erreur sql §<br />'.$sql.'<br />'.mysql_error());

//Ta boucle
$i=0;

while($data=mysql_fetch_array($req)) 
  { // ici la boucle qui permet d'effectuer la recherche 
  ?>
 <tr class="<?php echo ($i%2) ? 'classedufond2' : 'classedufond1'; ?>">
 <table>
    <td><?php echo $data ['departement']; ?></td>
	<td><?php echo $data ['region']; ?></td>
	<td><?php echo $data ['categorie']; ?></td>
	<td><?php echo $data ['souscategorie']; ?></td>	
    <td><?php echo $data ['typeannonce']; ?></td>
	<td><?php echo $data ['titreannonce']; ?></td>
    <td><?php echo $data ['descriptionannonce']; ?></td>
	<td><?php echo $data ['prix'].'<br /><br />'; ?></td>
</table>
  </tr>
 <?php
    $i++;
?>
    
<?php
  }
 mysql_free_result ($req);
mysql_close ();
  ?>
</table>

</div>

<div id="pied_de_page">
 <div id="boutonbas">
	<a href="information.html"><img src="contenu/information.png" alt="information" class="information" border="0"/></a>
	<a href="contact.html"><img src="contenu/contact.png" alt="contact" class="contact" border="0"/></a>
	<a href="newsletters.html"><img src="contenu/newsletters.png" alt="newsletters" class="newsletters" border="0"/></a>
	<a href="offre.html"><img src="contenu/offre.png" alt="offre" class="offre" border="0"/></a>
	<a href="aide.html"><img src="contenu/aide.png" alt="aide" class="aide" border="0"/></a>

</div>
</div>


</body>
</html>

tu veut dire que je doit repréciser <table> avant la boucle et le début du tableau ?

tu veut dire comme cela ?

<table> <!-- Début du tableau -->
  
 
<?php
$sql= 'SELECT * FROM annonces WHERE 1';
$req= mysql_query($sql) or die ('erreur sql §<br />'.$sql.'<br />'.mysql_error());

//Ta boucle
$i=0;

while($data=mysql_fetch_array($req)) 
  { // ici la boucle qui permet d'effectuer la recherche 
  ?>
  <table>
 <tr class="<?php echo ($i%2) ? 'classedufond2' : 'classedufond1'; ?>">
 
    <td><?php echo $data ['departement']; ?></td>
	<td><?php echo $data ['region']; ?></td>
	<td><?php echo $data ['categorie']; ?></td>
	<td><?php echo $data ['souscategorie']; ?></td>	
    <td><?php echo $data ['typeannonce']; ?></td>
	<td><?php echo $data ['titreannonce']; ?></td>
    <td><?php echo $data ['descriptionannonce']; ?></td>
	<td><?php echo $data ['prix'].'<br /><br />'; ?></td>

  </tr>
 
 <?php
    $i++;
?>
 </table>

Forum d'entraide PHPFrance

affichage sql dans CSS

affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS

Re: affichage sql dans CSS