Je sais qu'il existe une détection de navigateur dans mootools. Par conséquent, je veux savoir comment changer le style CSS dépend du navigateur? -V-Comment modifier le style CSS dépend du navigateur
Répondre
Peut-être les hacks CSS suivants seront utilisés:
http://www.cssblog.es/hacks-css-mediante-selectores/
Cordialement!
Que diriez-vous de chrome? –
pour un rappel personnel, j'ai posté ce petit exemple sur jsFiddle: http://www.jsfiddle.net/ghazal/XUXAP/ Peut-être que ça va vous aider Acclamations.
merci beaucoup! ^^ –
2 façons:
côté serveur
Detect chaîne de l'agent utilisateur et servent la feuille de style associée lors de la génération de la page.
feuilles de style conditionnel
Ce n'est servi à IE (toutes versions)
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<!--<![endif]-->
Jetez un oeil à:
http://css-tricks.com/how-to-create-an-ie-only-stylesheet/
Pour les conditions relatives aux versions différentes précisément.
Remarques
mieux pour tenter probablement de résoudre le problème sous-jacent plutôt que de recourir à hacks car il sera beaucoup plus facile à entretenir. Sachez également que de nouvelles versions sont publiées en permanence, que les versions des navigateurs peuvent être usurpées, etc. Il ne devrait être utilisé que pour des corrections spécifiques et isolées lorsque vous ne trouvez pas une autre solution.
Que diriez-vous de chrome? –
La détection du navigateur n'est nécessaire que pour les anciennes versions d'IE, s'il y a des problèmes dans d'autres navigateurs modernes, il s'agit probablement d'une erreur de développeur.
Une façon est de vérifier côté serveur:
// returns true on at least a minimal version of IE, or if is not IE
function checkIEVersion(minimal) {
var ver = true;
if (navigator.appName == 'Microsoft Internet Explorer') {
var ua = navigator.userAgent;
var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
if (re.exec(ua) != null) ver = parseFloat(RegExp.$1) >= minimal;
}
return ver;
};
Une autre façon est à l'aide conditional comments en html:
<!--[if lt IE 9]><html class="ie"><![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html><!--<![endif]-->
<!--[if lt IE 9]>
<script src="js/html5.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="css/ie.css">
<![endif]-->
Puis le style css régulière ressemblera à ceci:
.somestyle {}
Et le style de repli dans ie.css
ressemblera à:
.ie .somestyle {}
if (Browser.chrome) { document.id('foo').addClass('bar'); }
Pour plus voir Mootools documentation for Browser
question Nice, d'abord, vous pouvez ajouter différentes classes CSS comme:
.color-safari{}
.color-chrome{}
Ensuite, faire élément avec classe mais vide, comme:
<input id="myID" type="text" name="hi" class="">
Puis dans script par t, vous pouvez ajouter ce qui suit pour vérifier le navigateur:
var userAgent = navigator.userAgent.toLowerCase();
if (userAgent .indexOf('safari')!=-1){
if(userAgent .indexOf('chrome') > -1){
//browser is chrome
$("#myID").addClass("color-chrome");
}else{
//browser is safari, add css
$("#myID").addClass("color-safari");
}
}
J'ai essayé et ça marche, bravo!
avait une question similaire: http://stackoverflow.com/questions/4323186/browser-os-as-body-class – meo
La détection du navigateur ne devrait pas être faite parce qu'il n'y a aucune garantie que vous obtenez la bonne réponse et certains navigateurs peuvent usurper l'agent utilisateur. Au lieu de cela, utilisez la détection de fonctionnalité. Cependant, la plupart des navigateurs modernes n'ont pas besoin de CSS spécial. Seul IE nécessite de tels hacks mais c'est pourquoi ils ont créé des "commentaires conditionnels". – Rob