簡單的CSS媒體查詢不起作用

Question

以下網頁在桌面上正確顯示，但我無法弄清為什么它無法在Android手機上運行（文本的顏色始終為藍色）：

<html>
    <head>
        <style type="text/css">
            @media screen { body { color: blue; } }
            @media handheld { body { color: red; } }
        </style>
    </head>
    <body>
        This is a test!
    </body>
</html>

經過測試：

Android：4.0.4
標准android網絡瀏覽器：4.0.4-S7562XXALJ4
鉻：25.0.1364.169
的Firefox：19.0.2

在所有移動瀏覽器上，用於在計算機屏幕上顯示網頁的選項已被禁用。 使用媒體查詢的在線網頁可以正常工作。

我也嘗試過僅屏幕/非屏幕對，但仍然無法正常工作。

謝謝！

Answer 1

嘗試定位視口尺寸

@media screen { body { color: blue; } }
@media only screen 
    and (max-width : 420px) { 
    /* Styles */
    body { color: red; }
}

根據目標設備查看端口修改“最大寬度”

簡單的CSS媒體查詢不起作用

問題描述

1 個解決方案

解決方案1
0 已采納 2013-03-13 08:39:01

簡單的CSS媒體查詢不起作用

問題描述

1 個解決方案

解決方案1 0 已采納 2013-03-13 08:39:01

解決方案1
0 已采納 2013-03-13 08:39:01