CCS différents pour différents OS

Bloc de code:
<script language="javascript">
var navactu = navigator.platform;

if(navactu=="windows") 
document.write('<link rel="stylesheet" media="screen" type="text/css" href="ie.css" />');
}
else 
{
document.write('<link rel="stylesheet" media="screen" type="text/css" href="screen.css" />');
}

</script>

Un truc dans ce gout devrait pouvoir fonctionner avec le navigator.platform
 
.Steff a dit:
on de vrait oui...Mais là, j'utilise une police qui n'est en natif que sur OSX, linux etc...et sur windows, je ne peux pas obliger les internautes à télécharger la police que je veux...
Alors j'utilise une police de windows mais pour qu'elle s'affiche au mieux il me la faut en bold...Mais celle pour mac, je ne la veut pas en bold...
Peut être une solution ?
Sans utiliser de javascript, une solution pas très orthodoxe si tu veux utiliser ta fonte mac-only :

Bloc de code:
h1 {
    font-family: zapfino, "Arial bold", sans-serif;
}
Sur un navigateur mac, le zapfino s'affichera, tandis que dans windows le navigateur ne trouvant pas le zapfino passera à l'Arial gras et que dans linux le navigateur ne prendra que sans-serif. ;) :p

P.S. : j'ai essayé dans IE6 et Firefox Win et ça marche.
 
gloup gloup a dit:
...une solution pas très orthodoxe.
Au contraire, je trouve ta soluce assez classe !
CSS only, pas de cet infâme Javascript :zen:
 
Si tu travaills en PHP, tu peux également utiliser une classe qui selon moi est très pratique...

Je l'avais utiliser car je n'arrivais pas à une compatibilité parfaite sur MSIE, Safari et Autres. Je ne conseil évidemment pas d'utiliser plusieurs CSS, perso j'avais juste defini une autre balise dans mon CSS.

Elle s'utilise comme ceci :

Bloc de code:
//BROWSER
$br = new Browser;

if ($br->Name == "MSIE") $specificClass = "maintableIE";
elseif ($br->Name == "Safari") $specificClass = "maintableSA";
else $specificClass = "maintable";

.
.
.

Si interessé, je peux retrouver la classe dont je parle (elle vient du site les repertoriant).
 
sylver a dit:
Déterminer le système d'exploitation d'un visiteur n'est pas plus compliqué que déterminer son navigateur. Le script sera semblable à celui qu'a donné heroe, mais au lieu de tester navigator.appName (qui renvoie le nom du navigateur), il faudra tester navigator.platform (si j'en crois ce qui est dit sur Comment ça marche).
... et comment ça se passe si mon user agent est MSie/Wdz2000 ? Le site va vouloir m'envoyer la police windows que mon Mac ne pourra pas afficher... non ?
 
OlivierL a dit:
Au contraire, je trouve ta soluce assez classe !
CSS only, pas de cet infâme Javascript :zen:

En fait par «pas othodoxe», je voulais dire que normalement on n'écrit pas "Arial bold" comme ça, on choisit la fonte "Arial" puis on met un font-weight: bold. ;) A noter que sans-serif et serif devraient être mis à chaque fois pour les OS pauvres en polices (linux, pda, smartphones).

Attention aussi : 10% des gens désactivent le javascript dans leurs navigateurs, faut prévoir l'alternative. ;)
 
nicogala a dit:
... et comment ça se passe si mon user agent est MSie/Wdz2000 ? Le site va vouloir m'envoyer la police windows que mon Mac ne pourra pas afficher... non ?
Quand le navigateur ne trouve pas la ou les police(s) indiquée(s) dans la feuille de style, il prend celle indiquée dans les préférences.
 
Captain_X a dit:
moi ca me parait tordu comme truc... j'ai pas la solution, et à dire vrai que mon client soit sur mac ou sur PC j'ai vraiment d'autre chat à claquer....

y'a pas assez à se mordre les *******s avec IE et les autres navigateurs ?
C'est vrai qu'avec tous les nouveaux navigateurs qui sortent actuellement (pda, smartphone, console), il va vite devenir impossible d'utiliser telle ou telle css suivant tel OS ou tel navigateur. Mieux vaut suivre les standards et veiller à ce que la mise en page se dégrade correctement sur les navigateurs plus «exotiques». ;)
 
gloup gloup a dit:
Sans utiliser de javascript, une solution pas très orthodoxe si tu veux utiliser ta fonte mac-only :

Bloc de code:
h1 {
    font-family: zapfino, "Arial bold", sans-serif;
}
Sur un navigateur mac, le zapfino s'affichera, tandis que dans windows le navigateur ne trouvant pas le zapfino passera à l'Arial gras et que dans linux le navigateur ne prendra que sans-serif. ;) :p

P.S. : j'ai essayé dans IE6 et Firefox Win et ça marche.
Ho punaise ca c'est génial!!!!! Je vais de suite tester si ca fonctionne.
Je pense que c'est ce qui me plait le plus... J'aime pas trop trop le javascript (surtout parce que je sais pas faire !!!)
:up: :up:
 
.Steff a dit:
Ho punaise ca c'est génial!!!!! Je vais de suite tester si ca fonctionne.
Je pense que c'est ce qui me plait le plus... J'aime pas trop trop le javascript (surtout parce que je sais pas faire !!!)
:up: :up:
Je rêve ou c'est exactement la technique que j'ai proposé quelques posts plus haut ;) ?
 
sylver a dit:
Je rêve ou c'est exactement la technique que j'ai proposé quelques posts plus haut ;) ?
Salut sylver, désolé je crois que j'ai zapper ton post. :rose: En fait, tout ce que je voulais, c'est voir si on pouvait de mettre du gras directement avec la police pour le cas particulier de notre ami. ;)
 
sylver a dit:
Je rêve ou c'est exactement la technique que j'ai proposé quelques posts plus haut ;) ?
Non tu n'avais pas proposé cela :) Lui met directement du gras dans le font-family.
sylver a dit:
Pas besoin de sortir l'artillerie Javascript pour ça. CSS a prévu un mécanisme pour proposer plusieurs police, que le navigateur choisira en fonction de la disponibilité.

Par exemple, tu peux mettre ça dans ta CSS :
Bloc de code:
p { font-family: Futura-CondensedMedium, "Trebuchet MS", sans-serif; }
Tu m'avais simplement porposé de mettre différentes polices,ce que j'avais d'ailleurs déja fait.
Mais de toute facon, ca ne marche pas vraiment. Enfin qu'est ce que je dois mettre dans le font-weight apres? none, bold... Ou bien simplement le virer pour que windows prennent en compte le Arial Bold?
 
gloup gloup a dit:
Salut sylver, désolé je crois que j'ai zapper ton post. :rose: En fait, tout ce que je voulais, c'est voir si on pouvait de mettre du gras directement avec la police pour le cas particulier de notre ami. ;)
T'inquiète, c'est pas à toi que je faisais référence :)

.Steff a dit:
Non tu n'avais pas proposé cela :) Lui met directement du gras dans le font-family.

Tu m'avais simplement porposé de mettre différentes polices,ce que j'avais d'ailleurs déja fait.
Mais de toute facon, ca ne marche pas vraiment. Enfin qu'est ce que je dois mettre dans le font-weight apres? none, bold... Ou bien simplement le virer pour que windows prennent en compte le Arial Bold?
Attention à la confusion entre nom de police et valeur de la propriété font-weight.

Quand gloup gloup propose
Bloc de code:
h1 {
    font-family: zapfino, "Arial bold", sans-serif;
}
"Arial bold" représente la police nommée "Arial bold", et pas la police "Arial" avec la valeur de font-weight à "bold".

Ce "bold" de "Arial bold" ne doit pas être confondu avec le "bold" qui est une des valeurs de la propriété font-weight. Les autres valeurs sont normal, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900 et inherit (voir la spécification). Ces valeurs s'utilisent avec font-weight, comme ceci :
Bloc de code:
h1 {
    font-weight: bold;
}
ou
Bloc de code:
h1 {
    font-weight: bolder;
}
mais on ne les utilise pas avec font-family. L'exemple suivant est donc faux :
Bloc de code:
h1 {
    font-family: "Arial bolder";
}
tout comme celui-ci
Bloc de code:
h1 {
    font-weight: "Arial 100";
}
 
  • J’aime
Réactions: .Steff
sylver a dit:
Attention à la confusion entre nom de police et valeur de la propriété font-weight.
Oui d'accord j'avais pas compris ca moi. Enfin je croyais a ma surprise qu'on pouvais modifier la police ( la mettre bold) direct dans le font-family. Apparement pas alors. Merci du tuyaux.
Donc ou je pourrais trouver les polices dispo sur windows? A part sur un PC windows bien sur ;)
 
Captain_X a dit:
moi ca me parait tordu comme truc... j'ai pas la solution, et à dire vrai que mon client soit sur mac ou sur PC j'ai vraiment d'autre chat à claquer....

y'a pas assez à se mordre les *******s avec IE et les autres navigateurs ?
Merci du post qui fait avancer les choses :mouais: