内联样式优先于媒体查询吗?

时间:2016-01-15 18:02:18

标签: html css media-queries html-email

我之前使用html和内联css构建了电子邮件。我最近决定添加媒体查询,以使它们更适合移动设备。但是我想知道内联样式(css)是否优先于媒体查询。

例如:如果我对iPhone进行媒体查询,电子邮件会显示来自相应媒体查询或内联样式的样式吗?

谢谢!

2 个答案:

答案 0 :(得分:5)

当您定义内联样式时,它可用于您编写的所有设备和任何媒体查询集。

内联样式具有最高优先级,因此在您的情况下,显示的样式将具有内联样式。

如果您要覆盖内联样式,则需要使用!important在媒体查询中添加样式。

供参考 - CSS Specificity

答案 1 :(得分:0)

当浏览器使用您的页面时,它会像文本流一样使用它。它将首先遇到您的<script><link>标记,然后下载并执行JavaScript和/或CSS文件。然后,浏览器将继续将流转移到<body>。如果你有内联样式,浏览器b / c必须重新绘制页面,现在它在HTML中遇到了新的CSS。内联样式具有最高优先级,通常应该避免,但它们将覆盖外部CSS文件中的内容。