2

重複の可能性:
CSS メディア タイプ: CSS をモバイルにロードするには?

私はプロジェクトの途中です。ソースで使用するすべてのコードを見ることができます。

ホームページには軽量の JavaScript スライダーがありますが、モバイル デバイスで使用すると何らかの理由で表示されないという問題があります。それで、誰かが私が解決策を考え出すのを手伝ってくれるか、モバイルで見た場合に何か違うものを見せる方法を教えてもらえますか?

さまざまな IE スタイルを表示するには、これを使用します。

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="css/ie.css" />
<![endif]-->

モバイルに似たようなものはありますか??

4

4 に答える 4

8

そのためにメディアクエリを使用できます: http://www.w3.org/TR/css3-mediaqueries/

基本的には次のようになります。

@media only screen and (max-device-width: 480px) {
   /* .... styles */
}
于 2012-06-08T08:50:50.973 に答える
0

一部の人々は、ブラウザーのスニッフィングは悪い習慣だと考えているため、メディア クエリが良い解決策になる可能性があります。

私の見解では、モバイル デバイスにもさまざまなブラウザーがあり、ブラウザーごとに動作が異なるためです (特にブラック ベリー デバイス)。メディア クエリのブラウザ スニッフィングを行う必要があります。

モバイル デバイスごとに画面解像度が異なるため、サポートするモバイル デバイスごとに異なる CSS 条件が必要になります。

このリンクには非常に優れたチュートリアルがあります。

メディアクエリの使い方

解像度固有のスタイル シート

Javascript ブラウザの検出

于 2012-06-08T09:04:47.780 に答える
0

PHP でこれを行うには、以下のようなものを使用できます。

// check if user agent is mobile
function isOnMobile()
{
  // match popular mobile devices
  if (preg_match('/phone|iphone|itouch|ipod|symbian|android|htc_|htc-|palmos|blackberry|opera mini|mobi|windows ce|nokia|fennec|hiptop|kindle|mot |mot-|webos\/|samsung|sonyericsson|^sie-|nintendo|mobile/', strtolower($_SERVER['HTTP_USER_AGENT'])))
  {
    return TRUE;
  }
  return FALSE;
}
于 2012-06-08T08:52:03.917 に答える
0

メディア クエリを使用してみてください。

@media (max-device-width: 500px) {

}
@media (min-device-width: 500px) {

}
于 2012-06-08T08:54:17.617 に答える