3

私はサイトのモバイルバージョン（mobile.domain.comではない）を構築していますが、デバイスに基づいて異なるスタイルシートを提供しています。

だから私はこのようなものを持っています：

<link href="css/style.css" media="screen" rel="stylesheet"/>
    <link href="css/mobile1.css" media="only screen and (max-width: 480px), only screen and (max-device-width: 480px)" rel="stylesheet" type="text/css" />
    <meta name="viewport" content="width = 320px, initial-scale=1" />

私のモバイルスタイルシートは、明らかにモバイルサイトで必要なものだけを非表示/表示し、のクラス/スタイルをオーバーライドしていstyle.cssます。

私が抱えている問題は、オーバーライドしていないスタイルが見つからないように見えることです。つまり、完全に削除する style.cssと、サイトは完璧に見えます。私がそこに留まる style.cssと、それはそれほど完璧ではないように見えます。

ページの読み込み時にstyle.cssを動的に削除する方法はありますか？

それとも私はこれを完全に間違った方法で行っていますか？

4

2 に答える 2

3

私は自分のスタイルシートにIDを与えるだけで終わり、これを行いました:

jQuery('#mainStyleSheet').remove();

画面のサイズを確認した後、これを行いました。480 未満の場合は、古いスタイル シートを削除します。非常にうまく機能しているようですが、それが理想的なソリューションであるかどうかはわかりません。

于 2011-07-19T04:32:07.377 に答える
0

この例は Internet Explorer で機能しますが、iPhone の適切な呼び出し名を見つける必要があります。

<!--[if !IE]> //This will target everything except Internet Explorer browsers.
    <link rel="stylesheet" type="text/css" href="style.css"> //Add appropriate stylesheet.
<![endif]-->

<!--[if !iPhone]>
    ...
<![endif]-->

動作する可能性があります。よくわかりませんし、これを確認するための iPhone も持っていません。

于 2011-07-19T04:53:31.347 に答える