0

我正在为我的网站设计样式,我希望它对视网膜显示友好,为此我计划将媒体查询用于高 dpi 显示,但是我认为媒体查询不起作用,因为当我查看浏览器生成代码时我的视网膜 macbook,我可以看到身体仍然有默认的 css,而不是媒体查询中的一个。这是为什么?还有什么我需要添加的吗?请注意,默认 css 和媒体查询都在同一个 css 文件中,但是我认为这不是问题。

  /* ==========================================================================
   Theme Style
   ========================================================================== */

body {
    background-color: #ebebeb;
    /* background-image: url("../images/bg.png"); */
    background-image: url("http://bit.ly/Z1zQeb");
}

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 

    /* background-image: url("../images/bg_@2X.png"); */
    background-image: url("http://bit.ly/ZgBQ4c");
    background-size: 147px 147px;

}

编辑:我也在控制台中收到此错误:INDEX_SIZE_ERR: DOM Exception 1: Index or size was negative, or greater than the allowed value.

4

1 回答 1

1

您尚未指定要应用样式的标签。试试这个。

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    body {
        /* background-image: url("../images/bg_@2X.png"); */
        background-image: url("http://bit.ly/ZgBQ4c");
        background-size: 147px 147px;
    }
}
于 2013-03-07T14:38:23.533 回答