28220 sujets

CSS et mise en forme, CSS3

Passer des tableaux aux DIV ...

Bonjour, ceci est mon 1er post sur le forum.
Je remercie d'abord les gens qui ont participé a la création du site et du forum.
Maintenant je vous explique mon problème :
J'ai repris un cadre sur un site. Ce cadre est extensible selon le contenu du texte.
Il est fait d'une dizaines d'images (coinHD.png, coinBG.png etc...).
Je voudrai transformer ca avec des DIV et utiliser mes CSS, c'est possible?

Je vous envoi un extrait du code HTML : 

table border=0 cellpadding=0 cellspacing=0>
	<tr height=30>
	<td width=5 nowrap background="images/CoinHG1.gif">
	<td width=79 nowrap background="images/CoinHG2b.gif" valign="center" align="right">
	
	<div style="float:left; margin-left:6px;">
		<font size=2 color="#F0F0FF"><? echo $donnees['titre']; ?></font>	
	</div>
	
	<td width=9999 background="images/BordHaut.gif" valign="center">

	<td width=62 nowrap background="images/CoinHDG.gif">
	<td nowrap background="images/CoinHDM.gif" align="right" valign="center">
	<font size="2" face="Arial"><i><? echo date('d-m-Y', $donnees['timestamp']); ?></i></font>&nbsp;
	<td width=11 nowrap background="images/CoinHDD.gif">
	<td width=4 nowrap background="images/CoinHD2.gif">
	<tr height=50 bgcolor="#4E5EA8">
	<td background="images/BordGauche.gif">
	<td colspan=5 bgcolor="#C8EBC2">

	<font size="3">

 etc...


voila, merci !
Modifié par djedie (17 Jun 2005 - 18:41)
Bonjour et bienvenue.

Oui c'est possible en CSS, mais je me permet de te rappeller les règles de bases du forum (que tu as forcèment lu...) : avant de poster il faut utiliser la fonction recherche, lire la faq et les tutoriels pour voir si une réponse à ton problème n'existe pas.

Dans ton cas tu aurais pu trouver tout seul ici :
cadre arrondi ou graphique
Modifié par jb_gfx (17 Jun 2005 - 18:56)
oui je connais ce tuto.
mais la ce n'est pas pareil étant donné qu'ily a plusieurs images.
Et donc je ne sais pas comment procédé.
Salut djedie

en fait le truc avec les css c'est que ça n'intervient qu'après qu'une structuration html ait été faite

donc le mieux serait que tu nous donne un exemple du contenu que concernerait ta mise en page
Le tuto aussi contient plusieurs images, 2 ou 4 selon l'etape. Le tuto te donne les outils a toi d'adapter le reste...
bon, je vais essayer de le faire moi même et si j'ai des problèmes, je reposterai.

Mais en gros je dois transformer les balises <TABLE>, <TD> et <TR> en <DIV> nan?
non pas du tout

tu as un contenu (du texte par exemple)

tu l'annonces par un titre <hn>

tu mets le 1er paragraphe dans un <p></p>
idem pour le 2ème, le 3ème...
s'il y a quelque chose qui ressemble à un liste alors tu créés une liste <ul></ul>

etc...

et ça tu le fais de la manière la plus rigoureuse et intelligente possible.

Après et seulement après on peut éventuellement commencer à parler css.
Modifié par clb56 (18 Jun 2005 - 14:18)
<hn> ?
je connaissais même pas cette balise.Pour les <p> et les <ul>,<li>, je connais bien le principe.
Mais je veux savoier comment je dois placer les images pour avoir mon cadre.
A l'origine, les images (découpées) sont reconstituées dans un tableau, et bien maintenant je veux faire la même chose mais avec des calques.
djedie a écrit :
<hn> ?
je connaissais même pas cette balise.Pour les <p> et les <ul>,<li>, je connais bien le principe.
Mais je veux savoier comment je dois placer les images pour avoir mon cadre.
A l'origine, les images (découpées) sont reconstituées dans un tableau, et bien maintenant je veux faire la même chose mais avec des calques.


<hn> (ou <hN> ou <h*>) c'est un raccourci que l'on utiliser ici (et ailleurs) pour indiquer un titre de niveau parmis les 6 niveaux existant <h1>, <h2>, <h3>, <h4>, <h5>, <h6> et donc le "n" ("N", "*") correspond au niveau du titre et ce niveau est en fonction du contexte et de ce qui précède dans la page.
Sujet clos
Aller à