如何为移动设备隐藏 php 中的 div 内容？

Question

我在这个项目上使用 wordpress，这是我 php 文件中的 class 代码行：

<div class="footer-banner">

这就是我试图对移动设备隐藏但无法正常工作的方式，我真的不知道为什么：

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

div.footer-banner { display: none; }

}

Answer 1

尝试这样的事情。

如果您使用了 Boostrap 那么您可以使用 boostrap class hidden-sm 在移动视图中隐藏 div。

@media (max-width: 1199px) {
}

@media (max-width: 991px) {
}

@media (max-width: 767px) {
  .footer-banner{display:none}
}

Answer 2

对于移动设备，您需要使用媒体查询，因为移动设备的宽度大约在 320px 到 480px 之间

@media screen and (max-width: 481px) {
.footer-banner { display: none; }
}

并删除其他媒体查询。

谢谢

Answer 3

您在 HTML <head> 中设置元视口是否正确？

<meta name="viewport" content="width=device-width">

How to hide div content in php for mobile devices?