我正在使用React，并且试图基于设备的视口修改组件的内容。 我想出的解决方案是将移动设备的内容和台式机的内容包装在两个单独的div中，然后使用CSS“ display：none”和适当的断点来显示一个div或另一个div。我确信有更好，更有效的解决方案，但我找不到。
我更容易的方法是使用媒体查询。这些使您基本上可以根据浏览器/设备的大小来更改CSS，并且随着大小的变化，您可以通过在媒体查询中添加CSS来决定页面的外观。
请访问此站点以进一步了解：
https://www.w3schools.com/css/css3_mediaqueries.asp
