首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

CSS:如何为IE以外的所有浏览器加载css文件?

为了为IE以外的所有浏览器加载CSS文件,可以使用以下方法:

  1. 使用条件注释:条件注释是一种只在特定版本的IE浏览器中生效的HTML注释。可以在HTML文档中使用条件注释来加载特定的CSS文件。例如:
代码语言:html
复制
<!--[if !IE]> -->
<link rel="stylesheet" href="style.css">
<!-- <![endif]-->

这段代码将会在IE以外的所有浏览器中加载style.css文件。

  1. 使用CSS Hack:CSS Hack是一种通过在CSS代码中使用特定的语法来针对不同浏览器加载不同的样式。例如:
代码语言:css
复制
/* 针对非IE浏览器 */
@media all and (-webkit-min-device-pixel-ratio:0) {
    /* 加载样式 */
    body {
        background-color: red;
    }
}

/* 针对IE浏览器 */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* 加载样式 */
    body {
        background-color: blue;
    }
}

这段代码将会在非IE浏览器中加载红色背景,而在IE浏览器中加载蓝色背景。

  1. 使用JavaScript检测浏览器并动态加载CSS文件:可以使用JavaScript来检测当前浏览器类型,并根据浏览器类型动态加载对应的CSS文件。例如:
代码语言:javascript
复制
var isIE = /* 判断是否为IE浏览器的代码 */;
if (!isIE) {
    var link = document.createElement('link');
    link.rel = 'stylesheet';
    link.href = 'style.css';
    document.head.appendChild(link);
}

这段代码将会在IE以外的所有浏览器中动态加载style.css文件。

以上是三种常用的方法来为IE以外的所有浏览器加载CSS文件。根据具体情况选择适合的方法即可。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

解决cssie浏览器各种兼容问题

在进行网站开发过程中,IE是另很多程序员头疼一个浏览器,他版本兼容性很难调整,尤其是IE6,IE7,IE8,IE9,IE10这几个版本区别有很大。现在百度与谷歌都有了一行解决这种兼容性代码了。...– IE5 mode –> 5.如果一个特定版本IE支持所要求兼容性模式多于一种,: <metahttp-equiv=“X-UA-Compatible”content=“IE=5; IE=8″/...录入,下列 web.config文件使Microsoft Internet Information Services (IIS)能定义一个自订标头以自动使用IE7 mode来编译所有网页。...另外还有一起其他解决方案,例如google ie7 – js中是一个JavaScript库(解决IE与W3C标准冲突JS库),使微软Internet Explorer行为像一个Web标准兼容浏览器...,支持更多W3C标准,支持CSS2、CSS3选择器。

2K20

WordPress 根据浏览器 user-agent 按需加载CSS 文件

在进行前端开发时候,为了兼容性,比如hack 那个讨厌IE 浏览器,我们常常需要这类IE 判断代码来实现hack 效果。...而在WordPress 中,我们可以借助PHP 功能,通过判断浏览器user-agent 来按需加载CSS 文件——如此不仅仅只是对IE hack,对于chrome 、firefox 等主流浏览器也可以实现不同样式效果...'); 上面的代码应该很容易看懂,具体不解释了;如果你想对chrome 浏览器进行CSS hack,将CSS 代码以chrome.css 保存在主题目录下;如果用户浏览器是chrome 浏览器,便会加载该...chrome.css 文件,非chrome 浏览器绝对不加载——除非浏览器伪装user-agent 。.../ie.css', false, null); wp_enqueue_style('ie'); } 这么说来,如果想对不同浏览器进行不同样式展示,这个是再好不过方法了

1K80
  • CSS选择器 低版本IE浏览器兼容

    CSS 后代选择器很好用,让我们工作变更方便。但是 IE8 及以下对很多后代选择器并不兼容。...= 'Microsoft Internet Explorer') { //判断是否是IE浏览器     if (navigator.userAgent.match(/Trident/i) && navigator.userAgent.match...({ 'border': 'none','background': 'none' });     }); } 但是上面两种方法都是所有浏览器下都生效,也就是不用 last-child 都可以了。...0':'1px'); 没试过,因为不支持IE8。 纯css2方法:从第二个开始选择 有一种很简单方法,纯CSS实现。 就是使用 element+element 即一个元素紧接着另一个元素选择器。...因为 last-child 元素是没有紧跟这元素, element+element 为CSS2选择器。

    2.5K11

    根据IE版本加载不同CSS样式方法小结,解决低版本IE兼容问题

    自从中国联盟成员导航采用响应式布局之后,不少朋友反馈该页面在 IE8、IE7 浏览器会错排,经测试发现确实存在这个问题,但我一直也没去深究解决。...这几天博客折腾得很厉害,把多说开除了,而又由于 wopus 主机发邮件存在问题,死活没搞定之后,把博客搬家到了景安主机,最终才完善了博客原生评论框所有功能!...联盟导航响应式布局采用CSS3 Queries 方法,网上查了下,原来这个方法不兼容 IE9 以下 IE 浏览器,微软啊,你个蛋疼货!!...} }; }); 原理很简单,使用 js 判断 IEIE 版本,然后根据不同版本来改变当前 css 样式表 href,由于使用了 jQuery ready 预加载方法,所以需要在代码之前引入...三、通过条件注释判断浏览器版本,从而加载不同 css 样式表 代码非常简单: <!

    2.5K80

    WordPress 开发之让浏览器自动加载最新CSS、JS文件(免刷新缓存)

    在开发WordPress 主题时候,如果频繁更新主题CSS、JS文件但主题已经上线,如何让访客浏览器获取最新CSS、JS文件而非等到浏览器删除缓存后?下面就介绍一个简单方法。...即原来比如说css 文件路径代码是如下面的: http://devework.com/wp-content/themes/Devework/style.css 那么如果更新了css 文件,可以为此添加版本号...有过WordPress 主题开发经验都知道,WordPress 中引用主题styl.css 文件路径是直接使用函数<?php bloginfo('stylesheet_url'); ?...将下面的代码添加到主题functions.php 文件下即可为styl.css 文件添加时间戳版本号: add_action( 'wp_enqueue_scripts', 'add_styles' )...如此一来,就能保证浏览器每次访问都是最新css、js文件,而非采用缓存。 本文参考国外网站paulund,感谢原作者!如有错误,欢迎雅正!

    5K100

    WordPress 开发之让浏览器自动加载最新CSS、JS文件(免刷新缓存)

    在开发WordPress 主题时候,如果频繁更新主题CSS、JS文件但主题已经上线,如何让访客浏览器获取最新CSS、JS文件而非等到浏览器删除缓存后?下面就介绍一个简单方法。...即原来比如说css 文件路径代码是如下面的: http://devework.com/wp-content/themes/Devework/style.css 那么如果更新了css 文件,可以为此添加版本号...image.png 有过WordPress 主题开发经验都知道,WordPress 中引用主题styl.css 文件路径是直接使用函数<?...将下面的代码添加到主题functions.php 文件下即可为styl.css 文件添加时间戳版本号: add_action( 'wp_enqueue_scripts', 'add_styles' )...如此一来,就能保证浏览器每次访问都是最新css、js文件,而非采用缓存。 本文参考国外网站paulund,感谢原作者!如有错误,欢迎雅正!

    4.7K80

    知识整理之CSS

    CSS属性Hack(在标准模式下) color: red; /* 所有浏览器识别 */ _color: red; /* 仅IE6 浏览器识别 */ -color: red; /* 仅IE6 浏览器识别...解决方案: * { margin: 0; padding: 0; } 备注:这个是最常见也是最易解决一个浏览器兼容性问题,几乎所有CSS文件开头都会用通配符*来设置各个标签margin...link是HTML提供标签,不仅可以加载 CSS 文件,还可以定义 RSS、rel 连接属性等。...加载顺序区别 加载页面时,link标签引入CSS能被并行加载;@import引入CSS将在页面加载完毕后才加载。...标准属性在后(优化) 可维护性 将css文件放在页面最上面 样式与内容分离:将css代码定义到独立css文件中 重绘和回流描述及优化方案 这部分涉及内容较多,请移步至浏览器回流和重绘及其优化方式

    1.6K20

    判断IE版本语句 ...

    [endif]–> 1、条件注释基本结构和HTML注释()是一样。因此IE以外浏览器将会把它们看作是普通注释而完全忽略它们。...2、IE将会根据if条件来判断是否解析普通页面内容一样解析条件注释里内容。 3、条件注释使用是HTML注释结构,因此他们只能使用在HTML文件里,而不能在CSS文件中使用。    ...因为条件判断不依赖于某个浏览器hack,而是一个经过深思熟虑特色功能,所以我相信它是可以被放心地使用。当然,其他浏览器也有可能支持条件判断(到目前为止还没有),但是看起来,他们应该不会使用<!...注意:默认CSS样式应该位于HTML文档首行,进行条件注释判断所有内容必须位于该默认样式之后。     比如如下代码,在IE浏览器下执行显示为红色,而在非IE浏览器下显示为黑色。...正常就是默认样式,对IE浏览器需要特殊处理,才进行条件注释。在HTML文件里,而不能在CSS文件中使用。

    1.9K70

    HTML和CSS

    IE6之前CSS还不够成熟,所以IE5等之前浏览器CSS支持很差, IE6将对CSS提供更好支持,然而这时问题就来了,因为有很多页面是基于旧布局方式写,而如果IE6 支持CSS则将令这些页面显示不正常...改版时候更方便 只要改css文件。 页面加载速度更快、结构化清晰、页面显示简洁。 表现与结构相分离。 易于优化(seo)搜索引擎更友好,排名更容易靠前。 5. imgalt与title有何异同?...而将那些被认为“过时”或有功能缺失浏览器测试工作安排在开发周期最后阶段,并把测试对象限定为主流浏览器 IE、Mozilla 等)前一个版本。...它没有重置所有的样式风格,但仅提供了一套合理默认样式值。既能让众多浏览器达到一致和合理,但又不扰乱其他东西(粗体标题)。 在这一方面,无法做每一个复位重置。...它没有重置所有的样式风格,但仅提供了一套合理默认样式值。既能让众多浏览器达到一致和合理,但又不扰乱其他东西(粗体标题)。   在这一方面,无法做每一个复位重置。

    5.4K30

    谈一谈CDNJS,CSS文件加载出错主域名重试问题

    背景知识 【卡爷文章】CSS文件动态加载(续)—— 残酷真相 浏览器 CSS/JS 加载能力测试表 css、js相互阻塞 了解这些基础知识之后,我们再来谈谈怎么做 检测css是否加载出错 目前比较靠谱方案就是检测某一个特定样式来判断...css不阻塞js加载,但是会阻塞js执行。所以在浏览器里面css和js执行时保证顺序所有只要这段代码在link标签后面执行就可以直接判断文件是否加载完成。...='all'){media='all';}"> 检测js加载是否加载出错 如果你看过 浏览器 CSS/JS 加载能力测试表,那么就很容易知道script标签是会触发onload或者onreadystatechange...(ie浏览器)事件, 前面也提到了css和js执行时保证顺序。...performance.getEntriesByType('resource')可以获取到加载成功所有资源。

    2.4K10

    谈一谈CDNJS,CSS文件加载出错主域名重试问题

    背景知识 【卡爷文章】CSS文件动态加载(续)—— 残酷真相 浏览器 CSS/JS 加载能力测试表 css、js相互阻塞 了解这些基础知识之后,我们再来谈谈怎么做 检测css是否加载出错 目前比较靠谱方案就是检测某一个特定样式来判断...css不阻塞js加载,但是会阻塞js执行。所以在浏览器里面css和js执行时保证顺序所有只要这段代码在link标签后面执行就可以直接判断文件是否加载完成。...='all'){media='all';}"> 检测js加载是否加载出错 如果你看过 浏览器 CSS/JS 加载能力测试表,那么就很容易知道script标签是会触发onload或者onreadystatechange...(ie浏览器)事件, 前面也提到了css和js执行时保证顺序。...performance.getEntriesByType('resource')可以获取到加载成功所有资源。

    3.2K50

    前端性能优化

    服务器端(CDN)自动合并,基于Node.js文件合并工具,通过把所有脚本放在一个文件方式来减少请求数。...使用Data URI scheme将图片嵌入HTML或者CSS中;或者将CSS、JS、图片直接嵌入HTML中,会增加文件大小,也可能产生浏览器兼容及其他性能问题。...将首屏以外HTML放在不渲染元素中,隐藏,或者type属性为非执行脚本标签中,减少初始渲染DOM元素数量,提高速度。...不要使用CSS表达式 CSS表达式可以在CSS里执行JavaScript,仅IE5-IE7支持,IE8标准模式已经废弃。...使用外部JavaScript和CSS 外部JavaScript和CSS文件可以被浏览器缓存,在不同页面间重用,也能降低页面大小。 当然,实际中也需要考虑代码重用程度。

    2K41

    面试题-页面导入样式时,使用link和@import有什么区别,请详述讲解

    使用这种方式,所有CSS 代码只存在于单独 CSS 文件中,所以具有良好可维护性。...并且所有CSS 代码只存在于 CSS 文件中,CSS 文件会在第一次加载时引入,以后切换页面时只需加载 HTML 文件即可。...所以会出现一开始没有css样式,闪烁一下出现样式后页面(网速慢情况下) 区别3:link是XHTML标签,无兼容问题;@import是在CSS2.1提出,低版本浏览器不支持。...“style.css”)是最优选择,兼容浏览器最多。...虽然最多只能import 31次,但不会影响css里面的其他规则,body{}定义还能正常显示。 Firefox 没有发现有import最大值。

    74520

    JS魔法堂:LINK元素深入详解

    CSS解析 5. 渲染 五、属性rel介绍 六、动态创建LINK元素 七、与资源加载相关属性和事件 八、资源加载实验 1. IE结论 2. Chrome下结论 3....仅Chrome在disabled为true时,不加载样式文件。其他浏览器均依然继续加载文件资源。...CSS解析      首先需要理解CSS解析到底是什么?    其实就是在成功加载样式文件后,将样式文件样式添加到样式表document.styleSheets中。...其他浏览器只要成功加载样式文件就会将其中样式添加到document.styleSheets中,无论disabled属性值是什么。   5....对于有效路径资源且资源类型与type属性值匹配test.css),将加载并缓存起来,然后触发onload事件;       2.

    3.3K100

    前端面试01-HTML+CSS

    常用浏览器有chrome、safari、 IE、火狐(firefox) 、 Opera 、360、搜狗等 浏览器 内核 备注 IE Trident IE、猎豹安全、360极速浏览器、百度浏览器 firefox...为了在没有CSS情况下,页面也能呈现出很好地内容结构、代码结构 用户体验:例如title、alt用于解释名词 有利于SEO:利于被搜索引擎收录,更便于搜索引擎爬虫程序来识别 方便其他设备解析(屏幕阅读器...常用在script、img、iframe标签中,我们建议js文件放在HTML文档最后面。如果js文件放在了head标签中,可以使用window.onload实现js最后加载。...1.从属关系区别 @import是 CSS 提供语法规则,只有导入样式表作用;link是HTML提供标签,不仅可以加载 CSS 文件,还可以定义 RSS、rel 连接属性等。...2.加载顺序区别 加载页面时,link标签引入 CSS 被同时加载;@import引入 CSS 将在页面加载完毕后被加载

    67620

    Web性能优化之雅虎军规

    因为 ie,firefox等浏览器css全部传输完全之前不会去渲染任何东西。理由诚如小马哥说得那样很简单。css,全称Cascading Style Sheets (层叠样式表单)。...既然前面的可以被覆盖,浏览器在他完全加载完毕之后再去渲染无疑也是合情合理很多浏览器下,IE,把样式表放在页面的底部问题在于它禁止了网页内容顺序显示。...HTTP/1.1规范建议浏览器每个主机并行下载数不超过2个(IE只能为2个,其他浏览器ff等都是默认设置为2个,不过新出ie8可以达6个)。...因此如果您把图像文件分布到多台机器的话,您可以达到超过2个并行下载。但是当脚本文件下载时,浏览器不会启动其他并行下载。 当然对各个网站来说,把脚本都放到页面底部加载可行性还是值得商榷。...自己代码也这样岂不是对维护非常不方便。所有阿里巴巴中文站目前采用做法是在js和css发布时候在 服务器端进行压缩。这样在我们很方便地维护自己代码。

    1.2K100

    怎么提高网站访问速度_如何优化页面加载速度

    因为 ie,firefox等浏览器css全部传输完全之前不会去渲染任何东西。理由诚如小马哥说得那样很简单。css,全称Cascading Style Sheets (层叠样式表单)。...既然前面的可以被覆盖,浏览器在他完全加载完毕之后再去渲染无疑也是合情合理很多浏览器下,IE,把样式表放在页面的底部问题在于它禁止了网页内容顺序显示。...HTTP/1.1规范建议浏览器每个主机并行下载数不超过2个(IE只能为2个,其他浏览器ff等都是默认设置为2个,不过新出ie8可以达6个)。...因此如果您把图像文件分布到多台机器的话,您可以达到超过2个并行下载。但是当脚本文件下载时,浏览器不会启动其他并行下载。 当然对各个网站来说,把脚本都放到页面底部加载可行性还是值得商榷。...所有阿里巴巴中文站目前采用做法是在js和css发布时候在 服务器端进行压缩。这样在我们很方便地维护自己代码。

    4.8K30
    领券