第 8 题：如何实现浏览器响应式布局？

• 使用媒体查询（@media）

  使用媒体查询可以根据用户不同分辨率展示不同的样式（即可实现不同的布局方式），从而达到响应式布局

  @media screen and (max-width: 1920px) {
      body {
          background: red;
      }
  }
  
  @media screen and (max-width: 1600px) {
      body {
          background: blue;
      }
  }
  
  @media screen and (max-width: 1440px) {
      body {
          background: green;
      }
  }
  
  @media screen and (max-width: 960px) {
      body {
          background: yellow;
      }
  }

文章的内容/灵感都从下方内容中借鉴

• 【持续维护/更新 500+前端面试题/笔记】https://github.com/noxussj/In...
• 【大数据可视化图表插件】https://www.npmjs.com/package...
• 【利用 THREE.JS 实现 3D 城市建模（珠海市）】https://3d.noxussj.top/