1

商品の写真を「自然な大きさ」でWebサイトに表示したい。もちろん、最初に画像のサイズを計算します：

<Height of picture in pixels> * <real height of item in mm>
-----------------------------------------------------------
        <height of item on the picture in pixels>

数式は論理的に正しく、正常に動作します

desktop 17'' 4:3 monitor 1280*1024.

他のデバイスでは、メトリックが正しく表示されません。私はテストします：

2 smartphone.
22'' 1920*1080 desktop monitor
13.3'' 1366*768 notebook
14'' 1600*900 notebook

それらはすべて 4:3 のアスペクト比ではありません。それの何がいけないの？どうすれば目標を達成できますか? 私はウェブを検索しましたが、私が見つけた唯一の回避策は、A4サイズの紙を表示し、ユーザーにズームページを尋ねることです. ユーザーにシステムのセットアップを依頼したほうがよいのですが、どうすればよいですか?

4

3 に答える 3

1

残念ながら、ディスプレイの 1 インチあたりの正確なピクセル数をブラウザーに問い合わせる方法は存在しますが、ブラウザー ベンダーは便利な嘘に同意することにしました... すべてのブラウザーは 1 インチあたり 96 ピクセルを報告します。この事実をブラウザに報告させることはできますが、1 インチあたりの実際のピクセル数を取得する方法はありません。

有名な例は、ピクセル密度が根本的に異なるにもかかわらず、Javascript、HTML、または CSS を介して iPad 2 と iPad Mini の違いを検出する方法がないことです。

実際、紙を使用し、ユーザーにズームして「実際の表示サイズ」を調整するように求めるアプローチは、かなり賢いと思います。使いやすくすれば、きっと彼らはこの機能を高く評価してくれるでしょう!

于 2013-02-16T04:53:52.170 に答える
1

理論的には、CSS 2.1 仕様では、mm単位 (および や などの同様の単位cm)inは物理単位に関連しています。そのため、画像の幅を単位で設定した場合mm、ブラウザーは、デバイスの解像度で許可されている精度で、画像を特定の物理的尺度にスケーリングする必要があります。

実際には、ブラウザーは、CSS3 の値と単位の CR で説明されている方法により多く動作します。物理単位のセクションでは、定義上、1in等しいと述べており96px、プリンターなどの高解像度デバイスでは、実際の物理インチに対応するインチがアンカー単位ですが、ディスプレイなどの低解像度デバイスでは、ピクセルがアンカー単位です。「アンカー単位がピクセル単位の場合、物理単位が物理的な測定値と一致しない可能性があることに注意してください。」(また、プリンタであっても、CSSinと物理的なインチの対応は必ずしも正確ではありません。)

というわけでミッションインポッシブル。

ユーザーによるキャリブレーションには、A4 用紙は使用しません。それは大きく、誰もが手元に A4 用紙を持っているわけではありません。特に標準用紙サイズが異なる国ではそうです。インチとミリメートルの両方がある定規が良いでしょう。また、ズーム ウィジェットを追加して、ズームを簡単にすることもできます。

于 2013-02-16T07:35:53.960 に答える
0

ありがとうございます！私はすべてのヒントを組み合わせて画像を作成 し ました。

于 2013-02-19T16:01:29.240 に答える