我是否可以在内部CSS中使用媒体查询，并且避免加载我定义的背景图像？
我是否可以在内部CSS中使用媒体查询，并且避免加载我定义的背景图像？
提问于 2018-03-06 07:52:50
我正在开发一个响应式网站，每个页面都有一个在CMS中定义的大型英雄形象。我想避免在手机上下载该背景图像。
我能想到的唯一方法就是在页面头部添加一些内联CSS，如下所示：
<style type="text/css">
@media only screen and (min-width: 680px) {
.hero-image { background-image: url(../images/image.jpg); }
}
</style>
首先，我可以在内联CSS中使用媒体查询吗？
其次，这是否会避免在手机上下载图像？
第三，有没有更好的方法？
谢谢
回答 2
Stack Overflow用户
发布于 2018-03-06 15:53:40
是的，你可以在<style>标签中使用媒体查询。该图像只有在CSS需要时才会被加载，所以如果没有匹配的选择器，那么它不会打扰加载图像。
不过，将媒体查询包含在外部CSS文件中可能会更好。没有理由将它包含在内。
Stack Overflow用户
发布于 2018-03-06 16:56:21
不，你似乎不能内联@媒体标签：
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/-100007528
复制相关文章
相似问题