在各種移動設備上將網頁上的圖像縮放到1厘米寬

Question

我正在嘗試在移動網頁上縮放圖像（通過Cordova打包為Android / iOS），因此它始終具有以厘米為單位的已知寬度。 不管屏幕分辨率/大小如何-我都需要圖像具有以厘米為單位的已知寬度。 如果我要執行這種“本機方式”，我將檢查屏幕的ppi（每英寸點數），然后相應地調整以像素為單位的圖像寬度。

我嘗試了stackoverflow的各種解決方案，但未能找到解決方案。

正在開發一個cordova插件，它將分別覆蓋每個平台上的唯一解決方案，或者可以通過一些javascript（或cordova）代碼來完成。

Answer 1

如今，您不僅限於CSS中的像素，請訪問http://www.w3.org/Style/Examples/007/units.en.html作為參考，因此除了px，em和pt之外，您還可以使用cm厘米或英寸。

所以，要回答您的問題，您可以

<img src="someimg.png" style="width:1cm;" />

編輯：當我在系統上打開您的測試頁時，它就像一個超級按鈕。 但是，是的，在這種情況下，您可能需要做一些額外的工作，也許可以使用https://stackoverflow.com/questions/9292156/how-to-detect-the-screen-dpi-using- php-or-javascript可以縮小差距。

祝好運！

博瓦科