CSS @media display NOT in FULLSCREEN 不起作用？

Question

如何为窗口模式设置 CSS 规则？

@media all and (display-mode: fullscreen) {
  .testfullscreen {
      display: none; /*Works*/
  }
}

@media all and not (display-mode: fullscreen) {
  .testwindowed {
      display: none; /*Not working*/
  }
}

密码笔

Answer 1

你非常接近这一点，你只需要将not转向乞讨。

根据 MDN 的文档：

反转查询的含义

not 关键字反转了整个媒体查询的含义。 它只会否定它所应用的特定媒体查询。 （因此，它不适用于以逗号分隔的媒体查询列表中的每个媒体查询。） not 关键字不能用于否定单个特征查询，只能用于否定整个媒体查询。 在以下查询中最后评估 not：

@media not all and (display-mode: fullscreen) {
  .testwindowed {
    display: none; /*Is working*/
  }
}