28173 sujets

CSS et mise en forme, CSS3

bonjour à vous,

nous sommes en ce moment en train d'essayer de faire notre site en CSS propre.

notre problématique est d'éviter les CSS du style :

.MaDiv
{
   font-family: Verdana;
   font-size: 12px;
   color: blue;
   float: left;
   width: 11px;
   height: 7px;		
   margin-top: 2px;	
   background-image: url('/MonURL.gif');
   background-repeat: no-repeat;
}


et de découper en plusieurs style :

.MaPoliceTitre
{
   font-family: Verdana;
   font-size: 12px;
   color: blue;
}

.MonBackGroundTitre
{
   background-image: url('/MonURL.gif');
   background-repeat: no-repeat;
}

.MaPosition
{
   float: left;
   width: 11px;
   height: 7px;		
   margin-top: 25px;
}


pour cela j'ai vu plusieurs exemple, à priori on est obligé de faire :

<div class="MaPoliceTitre MonBackGroundTitre MaPosition">
...
</div>


n'y a t'il pas une solution d'héritage polymorphe comme en C++, avec :


MaDiv : MaPoliceTitre, MonBackGroundTitre, MaPosition


où on écrirait juste :

<div class="MaDiv ">
...
</div>



merci pour vos réponse.

Cordialement.
ALCINA.
Modifié par alcina (12 Sep 2007 - 18:10)
Bonsoir,

alcina a écrit :
n'y a t'il pas une solution d'héritage polymorphe comme en C++, avec :
MaDiv : MaPoliceTitre, MonBackGroundTitre, MaPosition


Non.
Euh... ben voilà.

Par contre, tu peux générer ta feuille de style CSS avec un langage serveur, PHP ou autre (en déclarant bien le type MIME "text/css" dans les en-têtes HTTP).
Bonsoir,
non cela n'existe pas, CSS ne fait intervenir que des critères d'héritage simple, de cascade et de spécificité (priorité) Smiley cligne
Si c'est bien un titre que tu décris, il serait plus pertinent d'un point de vue sémantique d'attribuer ces règles CSS à un Hn (n compris entre 1 et 6 inclus).
Modifié par Hermann (12 Sep 2007 - 20:31)
Tout d'abord merci pour vos réponses!

a écrit :

Non.
Euh... ben voilà.


arf!

a écrit :

Par contre, tu peux générer ta feuille de style CSS avec un langage serveur, PHP ou autre (en déclarant bien le type MIME "text/css" dans les en-têtes HTTP).


j'ai pas tout suivi là tu parles de :

<link href="MonCSS.css" type="text/css" rel="stylesheet" />

je vois pas le rapport peux tu détailler?


a écrit :

il serait plus pertinent d'un point de vue sémantique d'attribuer ces règles CSS à un Hn

tout à fait d'accord :
on préfèrera Hn à "MaPoliceTitre".

savez vous si la W3C a prévu d'intégrer cela dans le CSS 3?
le cas échéant pourquoi oui pourquoi non?

ma demande d'héritage est elle stupide? suis je le seul à me poser cette question?
Modifié par alcina (13 Sep 2007 - 10:15)
alcina a écrit :
savez vous si la W3C a prévu d'intégrer cela dans le CSS 3?

Il me semble que non. Les sélecteurs CSS 2.1 sont, mine de rien, déjà plutôt puissants. On peut regretter l'absence de support des sélecteurs CSS avancés (qui permettent de se passer d'un nombre important de classes ou identifiants ajoutés dans le code HTML) par Internet Explorer, et souhaiter que la version 8 en prenne plus en compte. Mais rien que le sélecteur de descendants est très efficace.

Ça n'est pas la même logique que celle que tu évoques, mais si tu connais mal ces possibilités des sélecteurs CSS (notamment: si tu connais uniquement les sélecteurs d'élément, d'identifiant et de classe), tu aurais intérêt à te pencher sur la question. Smiley smile

alcina a écrit :
le cas échéant pourquoi oui pourquoi non?

Non parce que:
- les sélecteurs CSS sont déjà puissants;
- certains besoins techniques sont couverts non pas nativement, mais via l'utilisation d'un langage dynamique côté serveur pour générer la feuille de style;
- rajouter un système comme celui que tu évoques pour faire un équivalent plus pratique de ce qui existe déjà (en dupliquant, raisonnablement, certains attributs de style) pose problème: quid du support par les «anciens» navigateurs (IE 5-8, Opera 5-10, Firefox 1-3, Safari 1-3...)? Dans l'évolution d'une spécification, il est plus simple (et plus réaliste) de procéder par ajouts/extensions que par remplacement de l'existant.

Mais il faudrait que je vérifie l'état des brouillons de CSS3. Je dis peut-être une bêtise... Smiley sweatdrop


Au sujet du type MIME à déclarer dans les en-têtes HTTP:

Quand le navigateur appelle un fichier machin.css, le serveur lui envoie le fichier avec (entre autres) l'en-tête HTTP suivant:
Content-Type: text/css
À moins bien sûr que le serveur ne soit très mal configuré.

Imaginons maintenant que tu utilises un script PHP pour générer ta feuille de style. Tu as donc un fichier machin.php, qui génère au final une feuille de style. Le problème, c'est que le serveur est probablement configuré, par défaut, pour envoyer l'en-tête suivant lorsqu'un fichier .php est demandé:
Content-Type: text/html

Donc, le navigateur doit comprendre que le fichier est du HTML. Il se peut donc que le navigateur n'applique pas la feuille de style, vu qu'il reçoit (à ce qu'on lui dit) du HTML plutôt que du CSS. Et même si on indique type="text/css" dans l'appel de la feuille de style, pas sûr que les informations du serveur ne soient pas prioritaires. Pour la déclaration de l'encodage des caractères, par exemple, les en-têtes HTTP sont prioritaires sur toute information contenue dans le code HTML.

Bref, toujours si on utilise PHP pour générer la feuille de style, il faudra commencer par déclarer du text/css qui va bien. Deux solutions:
- soit via la configuration du serveur (un petit .htaccess qui va bien dans le dossier contenant la feuille de style);
- soit via la fonction PHP header().