React-JSS 媒体查询不适用于 chrome 移动模拟器答案

【问题标题】：React-JSS Media Query does not work with chrome mobile emulatorReact-JSS 媒体查询不适用于 chrome 移动模拟器
【发布时间】：2018-09-01 01:37:03
【问题描述】：

我在我的 React 项目中使用 JSS，我遇到了奇怪的问题，我觉得很难解决。基本上我编写媒体查询，当我缩小我的桌面浏览器时会触发它。虽然在使用设备工具栏时，它似乎不起作用。当设备“宽度”小于 600 像素时，我试图隐藏跨度。任何帮助将不胜感激。

代码如下：

const menuStyles = theme => ({
  flex: {
    display: 'flex',
    alignItems: 'center',
  },
  wrapper: {
    composes: '$flex',
    cursor: 'pointer',
  },
  span: {
    fontFamily: theme.fontMontserrat,
    marginRight: '30px',
  },
  '@media screen and (max-width: 600px)': {
    span: {
      display: 'none',
    },
  },
});

【问题讨论】：

标签： css jss

【解决方案1】：

您始终可以检查生成的 CSS，如果它是您所期望的，那么您对 CSS/html 的假设是错误的。最后，jss 除了生成常规 CSS 之外什么都不做。

【讨论】：

【解决方案2】：

好的，问题已解决。它位于应用程序的完全不同的部分。

我忘记在我的代码中添加这一行：

<meta name=viewport content="width=device-width,initial-scale=1">

【讨论】：