5

iPhone の 0.5ems リンクで 16px のテキスト フォントを完全に表示するプロジェクトがあります。

しかし、Android ブラウザーに切り替えると、テキスト フォントが自動的に拡大され、リンクの配置がうまくいかなくなります。

私のリンクは

<p><a>[Link]</a></p>

声明。

Android テキストのサイズが変更されないようにする方法はありますか? または、これに対するより良い解決策はありますか？

編集：

Android ブラウザでは自動スクロールも許可されていないことに気付きました。これはなぜですか？iPhone と Android の両方のブラウザーは、Webkit をベースとして使用していませんか? 同じ技術を使っているのに、なぜこんなに違うのでしょうか。Safari と同じように動作するために、CSS で宣言する必要がある追加の属性はありますか?

4

4 に答える 4

3

私も同様の問題を抱えていました。私は Retina ディスプレイ専用に設計されたデザインを持っていましたが、実際には Retina ディスプレイのピクセル密度は 2 であるため、ピクセルは必ずしもピクセルではありません (非 Retina iphone ピクセル幅: 320px、retina: 640px)。

これを修正するために、これを<head>:に入れ<meta name='viewport' content='width=device-width, initial-scale=.5, maximum-scale=.5'>て、通常の電話が期待どおりにスケーリングされ、Retina ディスプレイが適切にスケーリングされるようにします (ハーフ スケール)。

使用しているデザインの種類はわかりませんが、初期スケールと最大スケールを試して、.5 と 1 の両方を試してみて、何が得られるかを確認してください。

于 2012-06-18T20:40:28.750 に答える
2

ピクセル (px) を使用する場合は、画面のピクセル密度に関連しています。iPhone の "retina" ディスプレイは、Android デバイスとは異なる方法でテキストを表示します。

この記事では、トピックについてかなり詳しく説明しています: http://kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/

于 2012-06-10T05:28:09.683 に答える
2

iPhone でのフォント サイズ レンダリングの不一致に関する別の質問に役立つ設定を見つけました。

body {
    -webkit-text-size-adjust: 100%;
}

代替値は、別の質問、iPhone のフォント サイズの問題で説明されています。

html {
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
}

これらのいずれかが Android ブラウザのサイズ変更を妨げているようです。お役に立てれば。

于 2012-06-18T21:46:19.140 に答える
0

Android によるピクセル値の自動スケーリングを停止したい場合は、これをビューポート メタに追加してみてください。

target-densitydpi=device-dpi

同じことについての良い参考文献は次のとおりです。

http://designbycode.tumblr.com/post/1127120282/pixel-perfect-android-web-ui

于 2012-06-22T07:17:30.603 に答える