响应式CSS：复制Facebook的聊天面板在某个浏览器窗口宽度以下消失的方式

Question

注意当你将窗口缩小到一定宽度以下时，facebook的右手，约200px宽的聊天面板/列会消失。 （然后切换到底部的拉出菜单）

我认为这是某种响应式CSS - 任何人都可以提供有关如何在我自己的网站上使用类似的右侧面板实现类似效果的任何指导吗？

Answer 1

是的，它正在使用CSS Media Queries。

<style>
@media (min-width: 701px) {
  //css for wide screen
}
@media (max-width: 700px) {
  //css for narrow screen
}
</style>