Discussion :

[zooffy]

Bonjour tout le monde.

Je suis pas encore trés doué avec CSS et je me pose une question de fainéant.

Dans mon site j'ai fait pas mal de classes CSS et vu que je travail beaucoup avec des module réutilisable, je me retrouve à mettre souvent la même chose dans les classes CSS.

Alors je voudrais savoir si je peux définir un truc dans un coin du fichier et l'appeller dans d'autre calsses et ensuite rajouter, éventuellement, d'autre commandes CSS.

Je vais expliquer par l'exemple :
Pour un module de fiche membre je défini le titre de la fiche avec ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
.TitreFicheMembre
{
    color:#663300;
    font-size:x-large;
    font-weight:bold;
}

Et dans un module de News je défini le titre du module de News de la même manière.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
.TitreModuleNews
{
    color:#663300;
    font-size:x-large;
    font-weight:bold;
}

Est ce que je ne pourrais pas définir la chose une fois et appeler ça à partir des Classes, un peu comme ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
DefinitionTitre
{
    color:#663300;
    font-size:x-large;
    font-weight:bold;
}
 
.TitreModuleNews
{
DefinitionTitre
Width:250px;
}
 
.TitreFicheMembre
{
DefinitionTitre
witdh:600px;
}

Le tout étant de savoir comment je défini DefinitionTitre et comment je l'appelle aprés.

Merci pour votre aide.

[aL1ba]

C'est très faisable et c'est une bonne idée d'être fainéant....car ça fait marcher les méninges ....

Je créerais par exemple des <div class="gen-menu size250">xxxx</div>
et pour le css, tu fais:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.gen-menu {background: yellow; color: blue; padding-bottom: 5px; margin: auto}

et

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

.size250 {width: 250 px; height: 20px;}

[zooffy]

Merci pour ton aide.

Malheureusement cela ne corrsepond pas tout à fait à ce que je cherche.
Dans le cas que tu présente, je dois placer .size250 sur chaque contrôle dans mon code HTML.
Ce que je voudrais c'est placer uniquement "TitreFicheMembre" et "TitreModuleNews" dans mon code HTML.

L'autre "classe" "DefinitionTitre" (parce que je ne sais pas si ça s'appelle une classe) ne serait appellée que dans le fichier CSS.

En fait, j'ai une contrainte sur le nommage des classes dans mon code. Mon système de site est dévelopé sous forme de module, donc je ne peux pas toucher au nom des classes CSS qui placée dedans. Je ne peux modifier que le fichier CSS.

Je sais pas si je suis bien clair.

[Macmillenium]

Malheureusement cela ne corrsepond pas tout à fait à ce que je cherche.
Dans le cas que tu présente, je dois placer .size250 sur chaque contrôle dans mon code HTML.

Niveau performance et maintenance, la meilleure solution (comme le précisait aL1ba) consiste à agréger les règles : Définir une règle générique .DefinitionTitre et ajouter les bouts qui font la différence :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<div class="DefinitionTitre TitreModuleNews">bla</div>

En fait, j'ai une contrainte sur le nommage des classes dans mon code. Mon système de site est dévelopé sous forme de module, donc je ne peux pas toucher au nom des classes CSS qui placée dedans. Je ne peux modifier que le fichier CSS.

Dans ce cas il faut recopier les déclarations à chaque fois.

[Bisûnûrs]

Ou alors tu peux faire comme ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
.TitreModuleNews, .TitreFicheMembre
{
    color:#663300;
    font-size:x-large;
    font-weight:bold;
}
 
.TitreModuleNews
{
   width:250px;
}
 
.TitreFicheMembre
{
   width:600px;
}

[zooffy]

Merci beaucoup pour ta réponse Bisûnûrs, cela me convient trés bien. Je crois que kj'ai la souplesse que je cherche avec cette technique.

Je suppose qu'elle est répétable à l'infini ?
Par exemple je peu faire une définitoin avec taille et couleur de texte où j'appele toute mes classes, puis deux autres qui définisse une largeur de 250 et de 600 pour les quelles je mets une liste de classe en appel qui reprends des clase déjà appellé pour la définitoin du texte.
Et apprés je peut encore définir spécifiquement des choses pour chaque classe séparément.

Quant à la maintenance, Macmillenium, dans l'absolu tu as entièrement raison. Mais dans mon cas, non, ce n'est pas applicable. mon système est fit de tel sorte que je ne pourrias pas mettre ce genre d'appel. Mon système repose sur le principe de l'utilisation d'une seul et unique fichier default.aspx pour tous MES sites.
Car oui, j'ai 7 sites qui tournent deçu en ce moment. Faire comme tu dis impliqueraus un principe faux à la base : je défini pour tous mes sites une gestion des textes (par exemple). Tel que mon système est foutu, ce n'est pas applicable.

Merci à tous.