Html 如何处理横向视图上的媒体查询

你好，朋友们，我有一个网站，其中有两个标题，一个标题出现在mob视图上，另一个出现在桌面视图上。我用@media隐藏和显示标题，直到我倾斜手机，它才正常工作。当我倾斜手机时，隐藏的标题会弹出，这是我使用的一段代码

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

.mobcat{
    display: none;

}

---

您可以像这样简单地向查询添加

（方向：横向）

    @media only screen and (max-width:767px)  and (orientation: landscape)   
    {
    .mobcat{ 
          display: none;
           }
    }

或

---

定义和用法在媒体查询中使用@media规则为不同的媒体类型/设备应用不同的样式。媒体查询可用于检查许多内容，例如：视口的宽度和高度设备方向的宽度和高度（平板电脑/手机处于横向模式还是纵向模式？）解决方案您真正想要实现的是什么？？

 @media (max-width:767px) and (orientation: landscape) { 
        .mobcat{ 
              display: none;
               }
       }