css 样式标签未在 safari 中评估

标签 css safari

我想根据带有@media 关键字的显示分辨率通过css 加载背景图像。它在 Firefox 和 chrome 中工作正常,但在 Safari 中不起作用。有什么我想念的吗?

<!DOCTYPE html>
<html lang="en">
    <head>

        <meta charset="utf-8">
        <title>Snowboardschule: Skigebiet</title>

        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" type="text/css" href="/fileadmin/css/style.css?1496823820" media="all" title="main">

        <style type="text/css">@media(min-resolution: 1dppx){ .trailer { background-image: url(fileadmin/_processed_/e/d/csm_trailer1_ca6cb9b743.jpg); }}</style>
    </head>
    <body>
        <header>
            <div class="trailer">
                ...  
            </div>
        </header>
    </body>
</html>

最佳答案

尝试使用

<style type="text/css">
@media and screen (min-resolution: 1dppx)
  { .trailer { background-image: url(fileadmin/_processed_/e/d/csm_trailer1_ca6cb9b743.jpg); }}
</style>

关于css 样式标签未在 safari 中评估,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44408604/

相关文章:

mongodb - chrome 和 safari 不会在设置了 Content-Length 的 go 服务器提供的 html 模板中呈现图像

html - 在悬停问题上显示子菜单

javascript - 我正在尝试打开一个具有某种效果的模态窗口

html - 对齐列表中心,而列表项在 d-flex 中向左浮动

iphone - 如果未安装 Facebook 原生应用,请打开 Facebook i safari

javascript - 使用 javascript 仅针对 Safari

html - 选择内部 flex 元素时,文本选择背景在 Safari 中变得不可见

CSS 文本居中和可调整大小

css - 有没有办法从 css 类中排除标签

macos - Safari 配置上的 OneSignal 网络推送通知不起作用