28172 sujets

CSS et mise en forme, CSS3

Bonjour,
est il possible de changer de style css (sans code php) suivant la page ?

j'ai un site avec 3 grandes familles, correspondant a 3 pages differentes (généré en BDD).
et j'aimerai que la couleur des liens changent suivant la page.

je ne sais pas si c est possible avec les selecteurs d'attribut, mais j'ai cru comprendre que le titre de la page pouvai faire office d'attribut.

voici differents exemples que j'ai put noter :

p[ title ] {color: #0000CC;}

div[class=error] {color:#F00;}

div[class=error] {color:#F00;}

td[headers~=col1] {color:#F00;}

p[lang|=en] {color:#F00;}

a [href='mapage.html'] {color: green;}


j'ai du mal a comprendre ces lignes de code, et a les inserer dans une page html ...

Merci de votre aide Smiley smile
Modifié par richo (14 May 2008 - 13:06)
Bonjour,

a écrit :
est il possible de changer de style css (sans code php) suivant la page ?


Pourquoi "sans code PHP" alors que c'est la meilleure solution à tout point de vue ? Smiley ohwell

Et je ne vois pas en quoi les sélecteurs d'attribut peuvent être utilisable dans ce contexte. Smiley rolleyes
OK, parceque je pensai qu'on pouvai faire ce genre de manip que avec du css (et je trouvai ca genial).
mais je crois que je me suis un peut trop emballé ... lol.

mais les exemple si dessus me permette de faire quoi exactement ?
Modifié par richo (11 May 2008 - 13:45)
haaaa super !!!
voila ce que je cherchais Smiley biggrin
Bon ben je vais me plonger la dedans.
donc si je comprend bien, cela ne permet pas d'avoir un style different celon le nom de la page ...

Merci pour le lien !!
a écrit :
donc si je comprend bien, cela ne permet pas d'avoir un style different celon le nom de la page ...


Absolument. Smiley smile
Waaawe, tu as repondu a mes questions en meme pas 3/4 d'heure, ca c 'est de l'efficacité !!!
Merci et a bientot Smiley smile
Modifié par richo (11 May 2008 - 14:06)
Administrateur
Bonjour,

IE6 ne comprend aucun sélecteur d'attribut, si ton site doit être compatible avec ce navigateur ce n'est pas la bonne solution. Smiley cligne
La façon la plus courante est de doter l'élément body (ou un div conteneur de tout ce que tu veux changer selon la page) d'un attribut id qui va varier selon le style.
HTML:
<body id="news"><!-- code HTML d'une page de news qui sera stylé différemment du reste du site --></body>

CSS:
/* h1 par défaut sur tout le site est gros, gras et rouge*/
h1 {
font-size: 2.0em;
font-weight: bold;
color: red;
}

/* pareil mais en bleu pour les pages "news" */
#news h1 {
color: blue;
}

La 2ème règle est plus spécifique (il y a un #id en plus) donc les instructions qui y sont définies prennent le dessus sur celles de la 1ère règle. Si c'est défini dans la 1ère mais pas dans la 2ème, ça reste actif puisque pas écrasé par une autre instruction.
Merci Felipe de ta reponse.
Effectivement ceci est là bonne solution, seulement les pages sont généré par la BDD,
j'ai donc une page pour la mise en page, et un fichier css.
et la seule façon de différencier une page avec une autre, c est son nom et pas son code.
Modifié par richo (14 May 2008 - 13:24)
Je profite de ce post (pour ne pas poluer le forum avec mes problemes)
sur la page produit

le bloc texte se trouve en bas sous ie7, et est pourtant bien centré sous FF, j'ai essayé de modifier la largeur et hauteur (generalement ca vien de là) mais là, je n'ai toujours pas trouvé la solution, si en passant quelqu'un trouve la ligne css miracle Smiley biggrin
Modifié par richo (14 May 2008 - 13:24)
bon finalement j'ai fait un tableau, c 'est pas le top, mais au moins ca marche.
Merci a vous.