溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹“怎么根據分辨率調用css文件”，在日常操作中，相信很多人在怎么根據分辨率調用css文件問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”怎么根據分辨率調用css文件”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！
根據分辨率不同，調用不同的css文件方法不同瀏覽器調用不同CSS文件
將以下JS代碼放入<head>和</head>標簽內，此段JS代碼作用是辨別瀏覽器分辨率
| <SCRIPT LANGUAGE="javascript"> <!-- if (window.navigator.userAgent.indexOf("MSIE")>=1) { var IE1024=""; var IE800=""; var IE1152=""; var IEother=""; ScreenWidth(IE1024,IE800,IE1152,IEother) }else{ if (window.navigator.userAgent.indexOf("Firefox")>=1) { file://如果瀏覽器為Firefox var Firefox1024=""; var Firefox800=""; var Firefox1152=""; var Firefoxother=""; ScreenWidth(Firefox1024,Firefox800,Firefox1152,Firefoxother) }else{ file://如果瀏覽器為其他 var Other1024=""; var Other800=""; var Other1152=""; var Otherother=""; ScreenWidth(Other1024,Other800,Other1152,Otherother) } } function ScreenWidth(CSS1,CSS2,CSS3,CSS4){ if ((screen.width == 1024) && (screen.height == 768)){ setActiveStyleSheet(CSS1); }else{ if ((screen.width == 800) && (screen.height == 600)){ setActiveStyleSheet(CSS2); }else{ if ((screen.width == 1152) && (screen.height == 864)){ setActiveStyleSheet(CSS3); }else{ setActiveStyleSheet(CSS4); }}} } function setActiveStyleSheet(title){ document.getElementsByTagName("link")[0].href="style/"+title; } file://--> </SCRIPT> |
解釋：
var IE1024="";
var IE800="";
var IE1152="";
var IEother="";
引號里面分別填寫，用戶使用IE的時候并且分辨率為1024*768,800*600,1152*864要使用的css文件名.
var Firefox1024="";
var Firefox800="";
var Firefox1152="";
var Firefoxother="";
引號里面分別填寫，用戶使用FF的時候并且分辨率為1024*768,800*600,1152*864要使用的css文件名。
var Other1024="";
var Other800="";
var Other1152="";
var Otherother="";
引號里面分別填寫，用戶使用其他瀏覽器的時候并且分辨率為1024*768,800*600,1152*864要使用的css文件名。
不判斷分辨率，只判斷瀏覽器
應E.Qiang提議，編如下代碼。實現根據瀏覽器類型自動調用不同CSS。
調用不同CSS文件JS代碼：
| <SCRIPT LANGUAGE="javascript"> <!-- if (window.navigator.userAgent.indexOf("MSIE")>=1) { file://如果瀏覽器為IE setActiveStyleSheet("default.css"); }else{ if (window.navigator.userAgent.indexOf("Firefox")>=1) { file://如果瀏覽器為Firefox setActiveStyleSheet("default2.css"); }else{ file://如果瀏覽器為其他 setActiveStyleSheet("newsky.css"); } } function setActiveStyleSheet(title){ document.getElementsByTagName("link")[0].href="style/"+title; } file://--> </SCRIPT> |
解釋：
如果瀏覽器為IE，則調用default.css
如果瀏覽器為Firefox，則調用default2.css
如果瀏覽器為其他，則調用newsky.css
用法：放在<head></head>中即可。
到此，關于“怎么根據分辨率調用css文件”的學習就結束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續學習更多相關知識，請繼續關注億速云網站，小編會繼續努力為大家帶來更多實用的文章！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
