使所有分辨率的div的寬度和高度相同（只有臺式機，不能移動）

Question

我目前正在開發一個新的安全和加密的社交網絡，現在我被卡住了。 我從來沒有想過我的網站將如何在其他臺式機和筆記本電腦（不是手機）上看起來。問題是我用px定義了所有的元素大小。 我希望我的網站在其他機器上的比例完全相同。

任何想法？

P.s.我不想用％

在此先感謝

Answer 1

的大小單位主題是廣義的，你應該讀了。

https://developer.mozilla.org/en-US/docs/Web/CSS/length

您有幾種選擇。其一，您可以使用媒體查詢來根據幾個分辨率範圍大大改變您的網站佈局。

https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries

兩個，你可以改變幾乎所有的px使用其他尺寸的單位之一。 em可用於基於當前字體大小的任何大小/距離，並且vh/vw可用於基於當前分辨率的基本大小。 （例如，width: 100vw將與屏幕一樣寬）

響應式佈局通常涉及將這些技術中的幾種一起使用。我的預測是，如果您希望在任何設備上使用相同的比例，則可能需要基於em上的所有距離，並根據媒體查詢在根上設置不同的font-size。也就是說，允許所有設備因其分辨率而具有不同尺寸並不總是錯誤;通常較小/較大的設備因此有調整的方式。例如，只有很少的網站無法使用，因爲蘋果爲OS X和Safari製作了超高分辨率顯示器。

如果您手邊沒有其他筆記本電腦，許多瀏覽器都可以使用他們的F12 Developer Tools來模仿其他設備或其他設備的分辨率。