Question

我一直在寻找有关响应式设计的很多东西，并且在服务器端和客户端上我都看到了几种实现方法，无论是使用jquery还是css媒体查询，我都想知道如何做到最好。但是我正在做一个大型网站，注册用户并可以上传文件。我正在考虑在索引中创建div，该索引根据屏幕包含php文件，这些div具有显示：没有，它们仅根据屏幕大小与媒体查询一起启用，如下例所示：

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>

<style>

 @media screen and (min-width: 600px) {
    .600px-min{ display: block }
    .940px-min{ display: none }
 }

 @media screen and (min-width: 940px) {
    .940px-min{ display: block }
    .600px-min{ display: none }
 }

</style>

</head>
<body>
   <div class="600px-min" style="display:none">
       <? php include("contents_600px.php"); ?>
   </div>

   <div class="940px-min" style="display:none">
       <? php include("contents_940px.php"); ?>
   </div>

</body>
</html>

如果我使用CSS这样做是否有好处？我只会运行div内的php脚本，这些脚本将具有正确的显示块？还是会从所有PHP脚本中下载所有html？还是为此使用jquery会有更多优势？我对此很懒，我正在研究很多，但是没有很多答案！

Answer 1

CSS媒体查询是构建响应式网站的唯一现代方法。 jQuery和服务器端解决方案已经过时了十年。

CSS Media Queries与Jquery响应式解决方案？

1 个答案: