28220 sujets

CSS et mise en forme, CSS3

Je debute en CSS

Bonjour à toute la communauté..

Je debute tout juste en CSS, je galére beaucoup et je n'arrive même pas a faire un exemple concret....

j'ai déja lu pas mal de chose sur le CSS, les conteneurs etc... mais j'ai du mal a voir concretement comment cela marche

j'aurais besoin d'un exemple concret...

par exemple comment je pourrais transformer ceci en CSS 


<table width="170" cellspacing="0" class="infoBoxLT" summary="infoBox"> 
    <tr><td background="images/infobox/info.gif" height="30" class="infoBoxHeadingLT"></td></tr> 
    <tr><td background="images/infobox/cadre_centrec.gif" class="boxTextLT"><a href="test">test</a><br><a href="test1">Test1</a></td></tr> 
   <tr><td background="images/infobox/cadre_bass.gif" class="infoBoxHeadingLT" height="20"></td></tr> 
  </table>


c'est sur cet exemple que je travail....mais je n'arrive même pas a transformer ce petit exemple.

Donc si on pouvait me montrer comment faire, je pense que je serais ensuite capable de faire le changement entier de mon site sans probleme Smiley lol

Merci d'avance
++
fab

PS : j'espere que je serais un jour en mesure d'aider a mon tour.
Administrateur
a écrit :
par exemple comment je pourrais transformer ceci en CSS

Tu ne peux pas transformer un code HTML en CSS. Ce sont deux langages différents.

Peut-être veux-tu remplacer tes tableaux par d'autres éléments (div, p, etc.) mais dans ce cas cela reste encore du HTML.

Le CSS n'intervient qu'ensuite, pour mettre en pages ces différents éléments (table, p, div, etc.)

PS : au fait, tu peux très bien utiliser des balises <table> avec une mise en page en CSS.

Je crois qu'il va falloir commencer par le commencement.
Tu trouveras à cette adresse de bons cours pour débuter HTML et CSS :
http://www.tuteurs.ens.fr/internet/web/html/bases.html
Modifié par Raphael (08 Mar 2005 - 12:29)
Oui en faite je me suis mal exprimé...

j'aimerais savoir comment modifier ce petit bout de code avec des balises <div><ul><li> etc...

et ainsi eviter les <table><tr><td>etc...

j'ai essayé des trucs mais j'y arrive tres mal...

en fait j'aurais besoin que l'on me transforme ce petit exemple, afin que je comprenne comment cela marche...

Pour m'attaquer au contenu de mon site web.

Encore merci

PS : sinon je connais bien les principes du html.

++
fab
Modifié par fab27 (08 Mar 2005 - 12:52)
Bon,

je vais essayer d'aprrendre tout ca...

mais déja a peine commencer... j'ai vu un exemple avec des balises <p> ou le texte est aligner comme ceci

lien1
lien2
lien3
etc...

moi avec ce code 


#information{
	font-size: 80%;
	width: 170px;
	background: url(images/infobox/cadre_centrec.gif) repeat-y;
}

#headininformation{
	margin: 0px 0px 0px 0px;
	padding: inherit;
	height: 30px;
	width: 100%;
	font-size: 80%;
	background: url(images/infobox/info.gif) no-repeat;
}

#bottom{
	margin: 0px 0px 0px 0px;
	background: url(images/infobox/cadre_bass.gif) no-repeat;
	height: 20px;
	padding: inherit;
	width: 100%;
}




<div id="information">
 <ul id="headinginformation"></ul>
 <p><a href="#">test</a></p>
 <p><a href="#">test1</a></p>
 <p><a href="#">test2</a></p>
 <ul id="bottom"></ul>
</div>


j'otient ceci

test

test1

test2

comment puis je supprimer les espaces entre chaque ligne pour avoir

test
test1
test2
Administrateur
fab27 a écrit :

comment puis je supprimer les espaces entre chaque ligne pour avoir

Il suffit de supprimer les marges par défaut de <p> :
p {margin: 0;}

Mais je crois sincèrement que tu devrais suivre la Méthodologie complète car tu manques cruellement des bases minimales et on ne pourra pas te les donner sur le forum.
Prend un peu de temps, suis les liens qu'on t'a donné et ça ira bien mieux Smiley cligne

Au fait, ton code ne veut rien dire : une liste est composée de balises <li> qui sont regroupées dans un <ul>.
Or dans ton code, tu as bien un <ul> mais aucun élément de liste mais des paragraphes (<p>), d'ailleurs tes <ul> sont vides.
<ul> ne sert que s'il contient des balises <li>
Modifié par Raphael (08 Mar 2005 - 13:53)
Sujet clos
Aller à