こんにちは。 html5を準拠するようにサイトを構築している者です。CSSでPC用、スマートフォン用、iPhone用に分けようと考えています。 http://mnemoniqs.com/web/one-css-smartphone/ 上記のサイトにて、 1<!--メインCSS--> 2<link rel="stylesheet" href="css/style.css" type="text/css" media="all"> 3<!--スマホ用CSS--> 4<link media="only screen and (max-device-width:480px)" href="css/smartphone.css" type="text/css" rel="stylesheet"/> この様に書いてありますが、私はauのAndoroidスマホを使用していまして、widthが481px以上になる環境です。それで自サイトをみると、PCでは3ペイン、スマホでも縮小された左右のペインがあります。iPhone、他のスマホでは左右のペインをなくして、メインだけを表示したいのです。 例として http://blog.livedoor.jp/dqnplus/archives/lite/1750885.html では、スマホで見ると左右のカラムが消えて、文字が大きくなり見やすく見やすいです。ですが私のサイトではそれが出来ていないのでそうはいきません。 ちなみにPCブラウザで http://blog.livedoor.jp/dqnplus/archives/lite/1750885.html を表示するとリダイレクトでPC用サイトに行ってしまいますので調べることが出来ませんでした。 どなたか1ページをCSSを使ってPC用、iPhone用、普通のスマホ用にする事が出来ないでしょうか？ お導きの事よろしくお願い申し上げます。
↧