7

特にiPhoneを対象としたCSSメディアクエリを使用しようとしています。

通常のリンク rel を使用すると機能します。

<link rel="stylesheet" type="text/css" href="css/mobile.css" />

ただし、このメディアクエリを試してみるとうまくいきません:

<link rel="stylesheet" type="text/css" href="css/mobile.css" 
      media="only screen and (max-width: 640px)" />

CSS メディア クエリを使用して iPhone をターゲットにするにはどうすればよいですか?

4

2 に答える 2

14

試す：

<link rel="stylesheet" type="text/css" href="css/mobile.css" media="only screen and (max-device-width: 480px)" />

違いはmax-device-widthただの代わりですmax-width。http://blogs.sitepoint.com/iphone-development-12-tips/の2) も参照してください。

于 2011-05-31T18:34:04.903 に答える
4

私はこれがあなたが尋ねたものと正確に一致していないことを知っていますが、私はちょうど似たようなものに答えたばかりで、役立つかもしれません：

<meta name='viewport' content='width=device-width; initial-scale=1.0;' />

CONTENTにはたくさんのパラメータがあり、そのうちのいくつかは次のとおりです。

maximum-scale=3.0; //Maximum zoom allowed 0 to 10.0. default is 1.6
minimum-scale=0.5; //Minimum zoom allowed 0 to 10.0. default is 0.25
user-scalable=1; //YES/NO
width=device-width; //default if not set is 980px 
initial-scale=1.0; //Initial zoom. 0 to 10.0. 1.0 would be 100%
height=device-height;

iOS 3.1.3のUIWebViewのコンテンツは拡大表示されますが、iOS4.3では正常に表示されます

編集：Safariでもこれらのパラメータを使用できます。ネイティブアプリケーション専用のuiwebviewのことは忘れてください。

于 2011-05-31T18:15:25.580 に答える