根据不同的浏览器加载相应的CSS文件本

最新推荐文章于 2021-06-19 14:15:41 发布
最新推荐文章于 2021-06-19 14:15:41 发布
阅读量2k 收藏 2
点赞数
分类专栏： HTML 文章标签： 浏览器 css firefox javascript function
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/encienqi/article/details/6194344
版权

发现一些CSS属性存在Firefox不兼容的现象，所以只能先判断用户的浏览器类型再加载CSS文件了。

　　写好适合各种浏览器的CSS代码后，只需把下面的代码放到网页的<head>与</head>之间就可以了：
<script language="javascript">
<!--
if(window.navigator.userAgent.indexOf("MSIE")>=1){
//如果浏览器为IE
setActiveStyleSheet("style1.css");
}
else if(window.navigator.userAgent.indexOf("Firefox")>=1){
//如果浏览器为Firefox
setActiveStyleSheet("style2.css");
}
else{
//如果浏览器为其它
setActiveStyleSheet("style3.css");
}
function setActiveStyleSheet(filename){
document.write("<link href=/"//images//"+filename+"/" type=/"text//css/" rel=/"stylesheet/">");
}
//-->
</script>

encienqi
关注
专栏目录
CSS条件注释详解（根据不同浏览器加载CSS）
09-25
主要介绍了CSS条件注释详解（根据不同浏览器加载CSS）这也是现阶段最方便的各种浏览器兼容方式了,需要的朋友可以参考下
根据判断浏览器类型屏幕分辨率自动调用不同CSS的代码
10-31
此部分代码示例只根据浏览器类型加载不同的CSS文件。 ```javascript <!-- if (window.navigator.userAgent.indexOf("MSIE") >= 1) { // 如果浏览器为IE setActiveStyleSheet("default.css"); } else { if ...
自动判断浏览器类型并读取相应CSS的代码
sightboy的专栏
06-03 506
实际工作中，经常会遇到浏览器版本不同网页代码就乱七八糟的情况，虽然可以在同一个CSS文件里面做到兼容，但是对于新手来说毕竟不太方便，又花费时间。比较懒的一个解决办法就是通过JS判断浏览器的类型，并读取相应的CSS文件，这样便基本上实现了网页代码兼容多浏览器。在网上找了一些这方面的代码，整合了一下，发出来，供大家方便使用，有出错的或者不会用的可以与我联系。HTML代码： 程序代码白天的影子-www.
根据浏览器不同加载不同的css实现兼容
高先生的猫
06-07 1353
浏览器有IE阵营、火狐阵营、谷歌阵营、苹果Safari阵营，特别是IE系列，更是有各种版本兼容问题，由于其他浏览器都能轻易升级到新版，而只有IE升级麻烦，高版本的IE甚至需要高版本系统的支持，低版本的系统根本装不了高版本的ie浏览器。 实际工作中浏览器的兼容性主要在于ie浏览器各种版本之间的兼容问题。 要根据浏览器不同加载不同的css实现兼容有很多方式，ie的条件注释实现不同浏览器加载不同css样式的方法 使用ie的条件注释区分不同浏览器 <!--[if lte IE 6 ]> <h.
HTML-基础，动态切换 css link 加载不同文件
roadmaps
06-19 568
html 动态切换css 引入
根据不同浏览器加载不同css文件
07-11 5859
通过判断浏览器类型而加载不同的css样式   如果你读了这篇文章，你会觉得IE浏览器很是让人头疼。但是如果你是一名优秀的前端开发人员的话，你必须得解决这个问题,我认为你可以用很多方法去解决这个问题，当然，hack除外，如果使用了hack,那么你做的网站将变得非常的危险！因为你使用了这些hack，你将不能保证这些暂时显示正常的页面在以后的浏览器中也是正常的，其中
使用javaScript动态加载Js文件和Css文件
10-23
用户在选择主题后，系统可以通过上述方法动态加载相应的CSS文件，从而改变页面的视觉样式。 同样地，对于JavaScript文件的动态加载，可以在某些功能模块中使用。例如，一个Web应用可能只有在用户进入某个特定页面...
Js判断CSS文件加载完毕的具体实现
10-26
但是，浏览器在处理CSS文件加载完成的事件时，并没有提供一个统一的接口，使得开发者需要根据不同浏览器的具体实现来编写相应的检测逻辑。在这一方面，IE浏览器相对其他浏览器而言提供了较为直接的方法，但其他...
在css加载完毕后自动判断页面是否加入css或js文件
10-25
例如，在IE9中，即使CSS文件是后来加载的，浏览器也会重新绘制页面元素以应用样式。但在IE8及以下版本的浏览器中，不会进行重新绘制，导致动态加载的CSS文件无法立即应用样式。因此，使用ajax异步加载css文件并确保...
判断用户浏览器及分辨率调用不同的CSS样式文件
09-27
最后，将这些代码整合在一起，就可以根据浏览器类型和分辨率加载相应的CSS文件了。对于浏览器类型的检测，我们可以使用`navigator.userAgent`属性： ```javascript var isIE = /MSIE/i.test(navigator.userAgent); ...
html-加载css样式的4种方法
appleLg的专栏
07-19 8836
加载css样式有4种 1.外部样式(外联样式) 如果css是一个外部文件，可以在你html文件的<head></head>里写上<link href="style.css" rel="stylesheet" type="text/css" />href=”style.css”这里可以写上你css文件的路径 这种形式是把css单独写到一个css文件内，然后在源代码中以link方式链接。它的好处是
根据客户端浏览器，加载不同的CSS文件
For The Future
08-22 1347
大家经常看到这样的一个网页，用Firefox浏览器打开的时候，网页的HTML代码中是这样的： [html] view plaincopy >   html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" class="FF">   用Google Chr
[if lte IE 9]……[endif]
mmayanfa的专栏
07-16 1027
项目范例说明![if !IE]The NOT operator. This is placed immediately in front of the feature, operator, or subexpression to reverse the Boolean meaning of the expression. NOT运算符。这是摆立即在前面的功能，操作员，或子表达式扭转布尔表达式
在不同的浏览器使用不同的css样式,解决浏览器兼容问题
热门推荐
菜鸟 on the road
07-23 3万+
<br /><br />让CSS区别不同浏览器 <br />区别不同浏览器，CSS hack写法：<br /><br />区别IE6与FF：<br />       background:orange;*background:blue;<br /><br />区别IE6与IE7：<br />       background:green !important;background:blue;<br /><br />区别IE7与FF：<br />       background:orange; *backg
通过判断浏览器类型而加载不同的css样式
zhuyangyong的博客
08-25 2404
&lt;转&gt;         IE浏览器很是让人头疼，可以用很多方法去解决这个问题，当然，hack除外，如 果使用了hack,那么你做的网站将变得非常的危险！因为你使用了这些hack，你将不能 保证这些暂时显示正常的页面在以后的浏览器中也是正常的，其中有一种很好的方法可 以解决这个问题，那就是使用IE的条件注释语句，IE条件注释语句支持所有的IE版本。  ...
根据不同浏览器写不同css
winrh的博客
07-24 1929
最近几天帮朋友弄了个简单的生日页面放在我的github博客上，就有了不同浏览器可能发生界面的错乱，如何解决？ 当然，作为一个小白，我的思路是通过js判断浏览器类型，再用jquery变换相应的样式。事实证明是可以的。 参考https://blog.csdn.net/zlf_php/article/details/78959234 这里只是进行最简单的判别 例子： $(function()...
JS判断各种浏览器，根据判断动态引入不同的CSS文件、JS文件
方寸之间
12-01 1万+
JS判断各种浏览器，根据判断动态引入不同的CSS文件、JS文件 function getBrowser() { var ua = window.navigator.userAgent; var isIE = window.ActiveXObject != undefined && ua.indexOf("MSIE") != -1; var isFi
使用JavaScript检测浏览器类型，并根据浏览器类型动态加载不同的CSS文件。
最新发布
04-26
你可以使用navigator对象来检测浏览器类型，具体实现代码如下： ``` var isIE = navigator.userAgent.indexOf("MSIE") !== -1 || navigator.userAgent.indexOf("Trident") !== -1; var isEdge = navigator.userAgent.indexOf("Edge") !== -1; var isFirefox = navigator.userAgent.indexOf("Firefox") !== -1; var isChrome = navigator.userAgent.indexOf("Chrome") !== -1; var isSafari = navigator.userAgent.indexOf("Safari") !== -1 && navigator.userAgent.indexOf("Chrome") === -1; if (isIE) { // 加载IE浏览器对应的CSS文件 var link = document.createElement("link"); link.href = "ie.css"; link.rel = "stylesheet"; document.head.appendChild(link); } else if (isEdge) { // 加载Edge浏览器对应的CSS文件 var link = document.createElement("link"); link.href = "edge.css"; link.rel = "stylesheet"; document.head.appendChild(link); } else if (isFirefox) { // 加载Firefox浏览器对应的CSS文件 var link = document.createElement("link"); link.href = "firefox.css"; link.rel = "stylesheet"; document.head.appendChild(link); } else if (isChrome) { // 加载Chrome浏览器对应的CSS文件 var link = document.createElement("link"); link.href = "chrome.css"; link.rel = "stylesheet"; document.head.appendChild(link); } else if (isSafari) { // 加载Safari浏览器对应的CSS文件 var link = document.createElement("link"); link.href = "safari.css"; link.rel = "stylesheet"; document.head.appendChild(link); } ``` 以上实现方法可根据不同的浏览器类型加载相应的CSS文件。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值