CSS rappel des styles

Version imprimable

30/04/2009, 11h18
deglingo592003

CSS rappel des styles
Bonjour à tous, j'ai du reprendre un site internet pour le mettre à jour mais voila mes connaissance étant très faible dans ce domaine je viens vous posez quelque question pour voir si j'ai vraiment bien compris :p

alors petit rapel : je vous met entre balise code, ce qui se trouve dans mon fichier .css

application à tout ce qui est entre balise <body> et </body>
Code:

1 2 3 body{ }
application a l'aide d'un class="maclass"
Code:

1 2 3 .maclass{ }
application avec un id="monid"
Code:

1 2 3 #monid{ }
application a une sous balise, exemple : affectation au p du body
Code:

1 2 3 body p { }
application a une sous balise bis, exemple : affectation au p pour id monid
Code:

1 2 3 #monid p { }
application sous balise3 :aie:
Code:

1 2 3 4 5 #sidebar ul ul li, #sidebar ul ol li { margin: 3px 0 0; padding: 0; }
cela s'appliquera uniquement dans les li situé dans les ul situé dans les ul situé dans un id="sidebar" ?

seconde partie

maintenant passons à ce que je ne connait pas du tout :mouarf:

je vous donne des exemples, je pense que ce sera le mieux :p
Code:

1 2 3 4 5 6 img.centered { display: block; margin-left: auto; margin-right: auto; }
est ce que cela sigifie que si je fait un class="centered" sur un div, par exemple, est ce que ce type de css ne s'appliquera que sur les balise img ?

un peu à la manière d'un
Code:

1 2 3 4 .centerd img{ code }
après second code que je ne comprend pas
Code:

1 2 3 4 html>body .entry li { margin: 7px 0 8px 10px; }
la je sait pas du tout :p

troisième code
Code:

1 2 3 4 5 #wp-calendar #prev a { padding-left: 10px; text-align: left; }
cela s'appliquera que sur les a situé dans un id="prev" qui lui même est dabns un id="wp-calendar" ? car par contre dans le reste du css il n'éxiste pas de #prev seul il ne se trouve que dans cette ligne :/

voila je pense avoir tout dit ou presque, merci d'avance pour votre aide car là je suis un peu perdu !
30/04/2009, 12h43
bengrum
Code:

1 2 3 img.centered { }
Ce code ne s'appliquera qu'aux images qui ont la classe "centered"
code html :

Code:

<img src='' class='centered' />
Code:

1 2 3 .centerd img { }
Celui-ci ne s'applique qu'aux images contenu dans un bloc de classe "centered" par exemple :
Code:

1 2 3 4 <div class="centered"> <img src='' /> </div>
Code:

1 2 3 4 #wp-calendar #prev a { padding-left: 10px; text-align: left; }
pour celui-ci : le css s'applique aux liens contenu dans un bloc d'id "prev" lui même contenu dans un bloc d'id wp-calendar. en html ça donne :
Code:

1 2 3 4 5 <div id="wp-calendar"> <div id="#prev"> <a href="">blabla</a> </div> </div>
j'en ai oublié un.

en css, le chevron permet de montrer la "filiation directe". donc pour que ça fonctionne, il ne faut pas qu'il y ai de balises entre ton <html> et ton <body>.

et IE6 ne comprend pas cette instruction donc je ne la conseille pas

en espérant t'avoir aidé, bon courage !
30/04/2009, 14h04
deglingo592003
oki ca m'éclaire un peu

mais j'ai une toute dernière question

pour avoir un
Code:

1 2 <img src='' class='centered' />
il faut que le css soit déclaré comme cela :
Code:

1 2 3 4 img.centered { }
est ce que si je défini juste un css comme cela
Code:

1 2 3 .centered { }
est ce que le premier code marchera toujours ? ou faut-il obligatoirement le définir de cette maniere.
Code:

1 2 <img src='' class='centered' />
merci d'avance pour toute l'aide apporter qui éclaire mon ignorance :)
30/04/2009, 14h27
Poulpynette
Les deux déclarations CSS sont bonnes.

La seule nuance c'est qu'avec celle-là :
Code:

1 2 img.centered { }
Tu ne pourras utiliser ta classe que sur des <img />.
30/04/2009, 14h48
deglingo592003
oki oki

je viens de trouver une nouvelle chose qui me parait bizarre a un endroit j'ai ce css là :
Code:

1 2 3 4 5 6 7 8 #sidebar ul ul, #sidebar ul ol { margin: 5px 0 0 10px; } #sidebar ul ul ul, #sidebar ul ol { margin: 0 0 0 10px; }
le premier signifie j'applique ce css pour les ul des ul où il y a un id="sidebar" et aussi pour les ol des ul où il y a un id="sidebar"

or le deuxieme reviens au "même" a part que on dit, tel style pour les ul des ul des ul dans sidebar et pour les ol des ul d'un sidebar

enfin je parle reviend au même pour le #sidebar ul ol

j'ai pas mal de doublon, triple quadruple ... :p de ce genre dans la feuille de style, c'est pas un peu des répétition inutile car au final il n'y aura que un style qui affectera les ol des ul ?

fiou j'arrive au bout de la compréhension mais c'est dur dur quand même de ce mettre dans ce genre de css :p
01/05/2009, 14h36
12monkeys

Citation:

Envoyé par deglingo592003

le premier signifie j'applique ce css pour les ul des ul où il y a un id="sidebar" et aussi pour les ol des ul où il y a un id="sidebar"

Pas tout à fait, sauf à ne pas t'avoir compris...

cela signifie que la déclaration va s'appliquer aux balises ul contenues dans une balise ul, elle même contenue dans une autre balise quelconque disposant d'un attribut id "sidebar".

Citation:

Envoyé par deglingo592003

or le deuxieme reviens au "même" a part que on dit, tel style pour les ul des ul des ul dans sidebar et pour les ol des ul d'un sidebar

enfin je parle reviend au même pour le #sidebar ul ol

j'ai pas mal de doublon, triple quadruple ... :p de ce genre dans la feuille de style, c'est pas un peu des répétition inutile car au final il n'y aura que un style qui affectera les ol des ul ?

fiou j'arrive au bout de la compréhension mais c'est dur dur quand même de ce mettre dans ce genre de css :p

Tu as deux déclarations pour #sidebar ul ol, ce sera alors la dernière qui s'appliquera, la première sera écrasée par la seconde... Donc elle ne sert pas trop...