28172 sujets

CSS et mise en forme, CSS3

Salut tt le monde,
J'ai un peu regarder sur le forum à la recherche d'informations sur les différents média pouvant être défini pour une page web et je me posais quelque questions.

Voila j'aimerai créer un site pouvant être afficher de manière différentes suivant les trois média suivant: screen, print et projection.
Je place donc dans ma page html le code suivant :
<link rel="stylesheet" type="text/css" href="./CSS/screen.css" media="screen" title="Design de Base"/>
<link rel="alternate stylesheet" type="text/css" href="./CSS/screen_print.css" media="print" title="Design d'impression"/>
<link rel="alternate stylesheet" type="text/css" href="./CSS/screen_proj.css" media="projection" title="Design de projection"/>


Malheureusement, pour que cela fonctionne je dois aller activer la feuille style correspondante via le navigateur (Mozilla) ce qui est un peu embêtant.
Alors ma question est la suivante: Connaissez-vous un moyen pour le navigateur repère de lui-même le support d'affichage ?

Merci de votre aide,
Lucifel

PS: j'espère qu'un poste n'a pas déja été créé sur le sujet , car je ne l'ai pas trouvé.
Modifié par lucifel (04 Jan 2010 - 22:06)
Les feuilles de styles destinées à un média particulier, quel qu'il soit, ne doivent pas être traitées comme des feuilles de styles alternatives. Autrement dit, une feuille de styles alternative ne vaut le coup que si elle est une alternative à une autre feuille de styles pour le(s) même(s) média(s) concerné(s).
L'exemple de code que tu donnes doit donc être corrigé comme suit :
<link rel="stylesheet" type="text/css" href="./CSS/screen.css" media="screen" title="Design de Base"/> 
<link rel="stylesheet" type="text/css" href="./CSS/screen_print.css" media="print" title="Design d'impression"/> 
<link rel="stylesheet" type="text/css" href="./CSS/screen_proj.css" media="projection" title="Design de projection"/>

Une petite lecture à ce sujet. Smiley cligne

Et pour vérifier le rendu d'une feuille de style pour l'impression, il suffit juste d'afficher un aperçu avant impression de ta page Web.
Modifié par Victor BRITO (03 Jan 2010 - 14:54)
Merci maintenant j'ai compris mon problème. En fait, lorsque j'utilise des feuille de style séparée physiquement y a un bug qui se produit (j'ignore pourquoi mais bon passons) tandis que si je travail dans un seul fichier en utilisant @meda print {} cela fonctionne à merveille, car je ne suis plus obligé d'activer le style pour qu'il fonctionne.
Cela devrai fonctionner également avec l'instruction @import mais le problème c'est que IE ne le reconnait pas donc, je vais rester sur l'instruction @media.

Merci Smiley smile