28221 sujets

CSS et mise en forme, CSS3

Bon je ne savais pas trop si je postais ça dans CSS ou dans XHTML vu que le but final est bien d'arriver à un page exempte de fioritures (dans le code bien sûr).

Donc état des lieux : maintenant que j'ai à peu près terminé (mais on n'en finit jamais Smiley fou ) l'apprentissage du XHTML, j'écris mes pages de telle sorte qu'il n'y ai que du contenu dedans. Ainsi je n'utilise les balises <img> que lorsque l'image qui sera visible fait parti du contenu de la page et pas du design. J'use et abuse donc de la propriété 'background'.

Le problème, puisqu'il y en a un, c'est que je bosse actuellement sur quelque chose de dynamique (un truc avec SPIP pour info) et certaines images comme les puces devant des titres (pas du contenu donc) ne doivent pas être choisi arbitrairement par le codeur, mais par ceux qui s'occupent de gérer le site.
Donc je vous passe les détails... en gros ces images sont sorties d'une base de donnée, etc.

Du coup je suis bien embêté moi puisque dans ma CSS ce ne sont que des propriétés fixes. Smiley confuse

Any idea?
Salut,

Je vois bien un moyen (mais qui risque d'être un peu moins performant en termes de vitesse) : mettre pour les images que tu utilises dans tes css et dont tu veux qu'elles soient dynamiques un truc du genre
url("puce.php");


Et dans la page puce.php, tu choisis l'image qui va bien (dans une bdd par exemple) et tu la renvoies dans le flux.
C'est le même principe que pour avoir un bandeau de haut de page aléatoire en php (tu trouveras facilement des articles sur le sujet).

Voilà j'espère que mon premier post te sera utile Smiley cligne
Je pensais personnellement à faire passer toute la feuille CSS à travers PHP, et donc avoir la possiblité de définir une variable dans la définition de l'image .
Erm, différentes options sont envisageables, la plus rapide serait d'avoir un truc du genre :


<link rel='stylesheet' type='text/css' href='image_liste.php'>


dans le code XHTML, et de mettre dans le image_liste.php sus-mentionné un :


<?php
 headers("Content-Type: text/css");
 // Récuperation de ce qu'il faut dans la base de données
 echo("
 ul#menu {list-style-image:url('{$valeur_recupereree}');}
 ");


Y a d'autres options, entre autres, demander que toutes les feuilles de style soient parsés côté serveur avant de les envoyer au client, mais l'impact sur les performances risque d'être relativement important...

Enfin, la version très brutale, mais très rapide aussi, ca serait de créer un fichier CSS par image possible, et de changer l'inclusion avec un

<link rel='stylesheet' type='text/css' href='{$feuille_de_style}') />

mais j'le recommanderais pas vraiment, entre autres parce qu'il est alors inutilement compliqué d'ajouter une nouvelle image possible.

En esperant que ca ait pu aider un peu,
DeFr
url("puce.php");


Mmmh ouais, j'étais tellement aveuglé par le fait que c'est un problème d'images, que j'avais zoublié qu'on pouvait mettre n'importe quelle url dans 'url(blabla)'.

Les performances on va dire que je m'en *hum* un peu car c'est pour un intranet d'établissement scolaire, donc il ne va pas y avoir 30000 requêtes à la seconde... En plus avec SPIP, une fois calculée, les pages sont mises en cache un certain temps, donc du coup même pour un site internet ça ne changerait pas grand chose.

Bref. Malgré tout, cela se corse. En effet j'ai un truc comme ça :
(une petite image-puce) un titre
(une petite image-puce) un titre
(une petite image-puce) un titre
(une petite image-puce) un titre
...

L'image est soit l'image par défaut, soit une qui a été attribuée uniquement à une partie précise.

Dans le code propre ça donnerait quelque chose comme :
<ul id="menu">
  <li>Partie1</li>
  <li>Partie2</li>
  <li>...</li>
</ul>


Si on avait la même puce partout à chaque fois, j'aurais pu faire url("image.php"). Mais comme il y a la possibilité que chaque élément du menu ai sa propre petite icone, c'est comme s'il fallait rajouté des arguments au "image.php" pour savoir de quel titre on parle.
Et encore une fois c'est impossible, et on en revient au point de départ puisqu'on insère pas quelque chose de dynamique dans la CSS.

Hum. Désolé je m'embrouille moi-même en écrivant ces explications. Smiley sleep
Modifié le 24 Oct 2004 - 22:35
Ben je vois pas où est le problème : s'il y a plusieurs éléments qui doivent être éventuellement choisis par une personne lambda, tu passes la feuille de style complète en .php, tu fournis à la personne qui doit choisir le look une interface lui permettant de stcoker en base les associations élément - règles, et tu crées le fichier css à la volée dans ton php. Smiley hum
AHAHAH de plus en plus compliqué ! Smiley fou Smiley langue
Le site est fait avec SPIP qui est en système de gestion de contenu.
Le contenu y est divisé en rubrique-sousrubrique-soussous... etc.
On peut définir une icône par défaut puis une pour chaque rubrique indépendament. Il y a déjà une grosse et belle interface pour toute la partie contenu qui est fourni avec SPIP.
Pour sortir simplement les informations, ce CMS propose un petit langage embarqué qui s'insère dans le html avec des balises. Mais pour chaque template on a un couple .php - .html, la page php appelant le template html mais en lui passant des arguments.

Ouf.

Tout ça pour dire que c'est vraiment compliqué de faire générer tout mon fichier CSS en php sachant que je vais devoir intégré du SPIP dedans et donc créé un nouveau couple php/html.

Yala yala !
Je vais finir par faire une entorse à la règle et mettre une balise <img>. En tout cas je n'aurai pas de problème d'accessibilité vu que le site est destiné à être vu sur des bornes intranet bridée dans un lycée. Si des élèves arrivent à contourner et à installé lynx durant les 10 min de récré, ils sont forts ! Smiley lol