mysql - 根据屏幕大小删除列

标签 mysql html css

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

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

最佳答案

是的,很容易。您可以使用媒体查询来做到这一点:

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

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

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

   .column4 {
       display:none;
   }

}

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

关于mysql - 根据屏幕大小删除列,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11839122/

相关文章:

mysql - 如何在node js中使用sequelize和mysql插入批量数据而不使用循环插入查询

java - hibernate 无法重新连接到 mysql 数据库

javascript - 如何从我的 HTML 嵌入视频重定向到另一个网页?

MVC 问题中的 JQuery Slider

html - Bootstrap - 更改行和列的顺序

mysql - 无法连接两个表,其中一个表有多行

mysql - 如何处理mysql load outfile函数中带空格的空值?

html - Angular如何在没有选择器标签的情况下动态生成组件

html - 960 GS 去除间隙

css - 为什么 css 过渡不起作用