我如何根據用戶屏幕大小顯示我的頁面

Question

是否有任何方法可以使用 php（不包括 js/jquery，因為我不知道如何使用它）來獲取用戶屏幕大小並使用它來使 css 與它一起工作

例如，如果我使用百分比而不是像素來設置我的高度和寬度，它仍然不會響應我手機的屏幕尺寸，並且用戶必須放大才能清楚地看到信息，它不會使它變大，我指的不僅僅是文本、圖像和 html 元素，例如 divs/spans/we...

我也不想使用引導程序，我想了解它是如何工作的，使用引導程序就像在不知道如何駕駛手冊的情況下駕駛自動車......

Answer 1

小型設備的網頁設計中的一件重要事情是將其包含在所有頁面的標題中：

<meta name="viewport" content="width=device-width"; initial-scale="1.0" />

它將頁面內容的自動“縮小”/縮小到當前視口（= 屏幕）大小停用，這對智能手機和平板電腦很重要。 一個像素仍然是一個像素，所以如果你的智能手機屏幕只有 320 像素寬，這就是絕對像素的寬度限制。

如果不包括在內，內置自動程序只會將無響應頁面的寬度解釋為 100% 並將其壓縮到設備的寬度，這將導致字體和圖像很小，您可以在每個頁面中看到無響應的網站。

在那之后，你將不得不成為媒體查詢的朋友......

Answer 2

有一些框架可以幫助您獲得這種行為。 最容易使用的方法之一是Twitter Bootstrap 。 它非常容易設置和理解。 它使用網格來確定頁面中元素相對於設備寬度的大小。 此外，還有許多預建項目可以幫助您入門。

另一個有用的框架是Foundation ，其概念與 twitter bootstrap 非常相似。 盡管它更靈活，但需要更多時間來學習如何使用它。

如果您打算自己完成自適應功能，或者如果您有興趣了解實際是如何完成的，您應該調查媒體查詢。