根据屏幕大小删除列

【问题标题】：Deleting column based on screen size根据屏幕大小删除列
【发布时间】：2012-08-07 22:13:59
【问题描述】：

我有一个 Python 程序，它使用 mod_python 从 MySQL 检索数据库条目并以 HTML 格式显示它们。该网页最终成为一个包含四列的表格，跨越整个页面。（我用 CSS 格式化）

如果屏幕宽度低于一定像素数，是否可以使用 CSS 更改列数？这四列中的一列包含大量信息，不适合在手机屏幕上查看。文字显得小而难读，放大也不方便。我想知道，如果屏幕尺寸小于 800 像素，是否可以使用 css 或其他方式删除此列？因此，在 iPhone 3g 上，表格将仅显示三列，而不是在更大的屏幕上显示四列。这将使文本更容易在旅途中阅读。

【问题讨论】：

标签： mysql html css

【解决方案1】：

是的，而且很容易。您可以使用媒体查询来做到这一点：

@media screen and (max-width: 800px) { your styles here }

因此，在您的情况下，您的 css 将具有列的样式，例如 .column4 {display:block;}，然后是您的媒体查询：

@media screen and (max-width: 800px) { 

   .column4 {
       display:none;
   }

}

您可以针对不同的屏幕尺寸进行不同的查询（在我的最新项目中，我使用了 6 种不同的布局，用于 6 种不同的分辨率和设备）。添加一些百分比，您可以拥有一个非常好的响应式网站。

【讨论】：

这就是我想要的。谢谢！