所以 CSS @media
查询在 IE8 中不起作用。
@media (min-width: 768px) {
/* some css */
}
@media (min-width: 972px) and (max-width: 1024px){
/* different css */
}
现在,我可以创建名为 IE_min768.css
和 IE_min972_max1024
的单独 CSS 文件,并使用 Javascript 动态加载和卸载文件作为调整页面宽度。但这违反了 D.R.Y.在多个地方维护 CSS 会很痛苦。
是否可以使用 Javascript(仅在 IE 中)实际读取 CSS 文件、检测 @media
部分并在正确的情况下将该 CSS 动态应用到浏览器?
最佳答案
不要重新发明轮子。只需使用 respond.js .
来自 GitHub 上的自述文件:
The goal of this script is to provide a fast and lightweight (3kb minified / 1kb gzipped) script to enable responsive web designs in browsers that don't support CSS3 Media Queries - in particular, Internet Explorer 8 and under. It's written in such a way that it will probably patch support for other non-supporting browsers as well (more information on that soon).
关于javascript - 使用 Javascript 读取 CSS 文件并动态更改页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12306728/