0

iPhone のニュースレターにメディア クエリを使用しようとしていますが、非常に基本的な例を機能させることさえできませんでした。次の例のスパンの色が iPhone でも青色のままである理由を誰かが理解するのを手伝ってくれますか? メタ タグ ビューポートを削除しようとしましたが、スパンのインライン スタイルも削除しましたが、それでもスパンが緑色に変わることはありません。

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<style type="text/css">

.test{
    color: #FF0000;
}

@media only screen and (max-device-width: 480px) { 
    .test{
        color: #00FF00 !important;
    }
}
</style>
    </head>
    <body>
    <table class="w600 l-content-table" border="0" cellpadding="0" cellspacing="0" width="600" style="letter-spacing: -0.01em; border-collapse: collapse; font-family: arial; text-align: left; margin: 0px; padding: 0px; border: 0px;">
            <tbody style="margin: 0px; padding: 0px; border: 0px;">
                <tr>
                    <td class="w600" height="55" width="600" style="color: #6f6f6f; border: #6f6f6f;">
                        <span class='test' style='color: #0000FF'>Test</span>
                    </td>
                </tr>
            </tbody>
        </table>
    </body>
</html>

これと非常によく似たトピックがあるようですが、答えが得られず、私の問題はもう少し基本的なものです。

HTMLがIE8で開かれた電子メールとしてこの送信をテストします

4

1 に答える 1

1

実際には、Apple の開発者ポータル (登録する必要はありません) を介して入手できるかなりの数のドキュメントがあります。特定の質問については、このリソースがうまくいくはずです:

https://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/OptimizingforSafarioniPhone/OptimizingforSafarioniPhone.html

これは、技術的なことからユーザー インターフェースのガイドラインに至るまで、iOS の Web アプリについて詳しく学ぶための良い入り口でもあります。


そうは言っても、@media クエリが CSS の最後の部分になるように、CSS を並べ替える必要があります (以前の CSS 定義を上書きする必要があるため、それらを自分の方法で並べ替えると上書きできません)。

于 2013-06-19T08:07:28.507 に答える