如何在PHP中使用媒體查詢？

-2

如何在PHP中使用媒體查詢？我已經有一個代碼，但問題是，當您更改窗口的大小時，設計不會更改。有沒有可能的方法？如何在PHP中使用媒體查詢？

 <?php 
     if (isset($_GET['width'])) { 
     $width = $_GET['width']; 
     if ($width <= 800) { //mobile devices 
      $style = '<link rel="stylesheet" href="mobile.css" type="text/css">'; 
     } else { //desktop 
      $style = '<link rel="stylesheet" href="style.css" type="text/css">'; 
     } 
     echo $style; 
     } else { 
      echo "<script language='javascript'>\n"; 
      echo " location.href=\"${_SERVER['SCRIPT_NAME']}?${_SERVER['QUERY_STRING']}" . "&width=\" + screen.width; \n"; 
      echo "</script>\n"; 
      exit(); 
     } 
    ?>

來源

2017-07-03 PatSchm

您可以在調整大小後刷新窗口嗎？ –

如何通過獲取參數傳遞給PHP的寬度？僅供參考，您可以使用不帶php的媒體查詢，因爲瀏覽器會爲您檢測設備詳細信息。看看Davids的答案;） – BenRoob

@JaydeepMor沒有..它始終需要原始屏幕的寬度（例如：1920px） – PatSchm

我不明白這是如何工作的，因爲PHP在確定瀏覽器寬度之前運行。然而，它不是必需的。你想要做的是將媒體查詢應用到鏈接元素。

<link rel="stylesheet" media="screen and (max-width: 800px)" href="mobile.css"/> 
<link rel="stylesheet" media="screen and (min-width: 801px)" href="style.css"/>

來源

2017-07-03 07:15:42

有趣的。我不確定我是否比樣式表中的普通媒體查詢更好。您可能想要添加有關兼容性的詳細信息，但這不是普遍支持的。 –

這裏的想法是加載一個基於mq的資源。如果你在文件中有mq，它已經被加載。但我不確定，如果這觸發到服務器的往返。我個人更喜歡一個高度優化的文件 –

PHP在頁面呈現之前執行。如果你的目標是更動態的行爲，我會建議使用JS。更多的東西是這樣的：

$(window).resize(function(){ 
    ... 
});

或香草JS

window.onresize = function(event) { 
    ... 
};

有了這個，你實際上可以裝載/卸載你提到的CSS文件。

我的建議雖然是隻依靠一個很好的（也是唯一的）CSS文件，其中包含所有的媒體查詢。

Responsive Web Design - Media Queries

來源

2017-07-03 07:17:46

如何在PHP中使用媒體查詢？

回答

相關問題