可以将CSS @media规则放入行内吗？
可以将CSS @media规则放入行内吗？
提问于 2012-03-21 23:55:44
我需要动态加载到一个HTML5应用程序的横幅图像，并希望有几个不同的版本，以适应屏幕宽度。我不能正确地确定手机的屏幕宽度，所以我能想到的唯一方法就是添加div的背景图像，并使用@media来确定屏幕宽度并显示正确的图像。
例如：
<span style="background-image:particular_ad.png; @media (max-width:300px){background-image:particular_ad_small.png;}"></span>这是可能的吗，或者有人有其他的建议吗？
回答 7
Stack Overflow用户
发布于 2012-03-21 23:59:16
内联样式当前不能包含声明(property: value对)以外的任何内容。
您可以在文档的head部分中使用具有适当media属性的style元素。
Stack Overflow用户
发布于 2018-07-12 14:30:32
是的，如果你使用的是图片标签，你可以在inline-css中编写媒体查询。对于不同的设备大小，您可以获得不同的图像。
<picture>
<source media="(min-width: 650px)" srcset="img_pink_flowers.jpg">
<source media="(min-width: 465px)" srcset="img_white_flower.jpg">
<img src="img_orange_flowers.jpg" alt="Flowers" style="width:auto;">
</picture>Stack Overflow用户
发布于 2016-11-17 16:33:56
现在，您可以使用<div style="color: red; @media (max-width: 200px) { color: green }">或其他工具。
好好享受吧。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/9808233
复制相关文章
相似问题