12

私はこれをhtmlで使用します:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;">

そしてこれはCSSで:

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }\

またこれを試しました:

html { -webkit-text-size-adjust: none; }

それでも何らかの理由でこれが発生します:

ここに画像の説明を入力してください ここに画像の説明を入力してください

更新:CSSのいずれかがこれを引き起こしているかどうかを確認するためにすべてのスタイルを削除しようとしましたが、結果は奇妙でした:フォントルールを使用していない場合、フォントは単純に大きくなります(ズームがロックされているためズームインされません) HTMLviewport属性によって)また、小さいフォントだけが大きくなり、ヘッダーは同じままです。奇妙な@#$%

更新2:html / cssで遊んで、この結論に達しました-テキストの拡大が起こらないのは、テキストがページ内の唯一の要素内に含まれている場合だけです-たとえば、私の体に含まれているものがすべてpである場合/ span / divにテキストが含まれている場合、拡大されません。テキストを含む別の要素を追加すると、ページ上のすべてのテキストが横向きモードで拡大されます。
私はいくつかの調査を試み、多くのモバイルサイトを調べましたが、結果は同じです-それらはすべてこの効果があります。

4

4 に答える 4

2

実際のソリューションよりも多くの情報

このページこのページに従って物事がどのように機能するかについての私の理解に基づいて、すべてのテキストは、 -webkit-text-size-adjust: auto(iOSのデフォルト)またはの設定に基づいて、横向きモードでリファクタリングされます-webkit-text-size-adjust: 100%

100%設定があなたが思っていることをしているとは思いません(テキストサイズを同じに保つ試み)。むしろ、それは「テキスト膨張アルゴリズムがどのように適用されるか」(このページによる)にのみ影響を及ぼします。私はそれが何を意味するのかを正確に突き止めることができませんでした。つまり100%、インフレアルゴリズムに関して何を意味するのでしょうか。私の推測では、このページの引用に基づいています...

Webページが初めてレンダリングされるとき、iOS上のSafariはブロックの幅を取得し、テキストが読みやすいように適切なテキストスケールを決定します。

...手順は「Webページが初めてレンダリングされるとき」にのみ発生するため、デバイスが縦向きから横向きに変わると、画面の幅の変化に基づいてインフレーションアルゴリズムがテキストを「拡大」します。に設定し100%ます。

おそらくこれは100%、ポートレートとランドスケープの幅の違いに関連しているためです。たとえば、このiPhoneの仕様は960 x 640です。これ100%は、インフレが960 x 640(たとえば、960/640 x 100%)の直接的な関係を使用し、1.5になることを意味している可能性があります。これにより、「大胆さ」が発生します。風景のテキストの。そのような場合、理論的には、影響を受けない-webkit-text-size-adjustように設定する必要があります66.67%(1.5係数を1に戻します)。しかし、私はそれがそれほど単純であるとは確信していません。

最終的に、Andrey Bukatiの答え-webkit-text-size-adjust: none;は、テキストサイズの変更が発生しないことを保証する唯一の方法だと思います。しかし、他の、おそらく望ましくない影響を与える可能性があります。

于 2012-05-29T00:00:42.713 に答える
1

cssを次のように置き換えてみてください

html { -webkit-text-size-adjust: none; }
于 2012-05-27T21:57:10.413 に答える
1

以下を追加してみてください...

-webkit-transform:translate3d(0,0,0);

于 2013-01-08T09:49:31.177 に答える
0

うーん、やってみて

body { -webkit-text-size-adjust: none; }

それ以外の

html { -webkit-text-size-adjust: none; }

このスレッドでそれを見つけました、そしてそれはスレッドの人と私の両方のために働きました。

于 2013-02-03T07:31:58.363 に答える