【报Bug】MOOC学院响应式设计
文章目录
是在写这个笔记的过程中发现的Bug
–
今天学了CSS的媒体查询，就顺便拿MOOC学院来看一下，然后就发现…
首页
↑ 首页并没有采用媒体查询的设计
课程
↑ 页面缩小时，课程栏从３栏直接跳成１栏，导致图片太大。（本来应该是２栏课程的）
↑ 页面缩小时，导航栏上的首页、课程、社区等等的错位了。
讨论区
留学
↑ 页面缩小时，导航栏上的首页、课程、社区等等的错位了。
↑ 页面缩小时，课程栏从３栏直接跳成１栏，导致图片太大。（本来应该是２栏课程的）
↑ 这附图展示了
fixed上面的错误，筛选栏悬浮在了图片上方，与导航栏之间本来不应该有间隙。
–
（⊙ｏ⊙）…
大家可以也试试，打开MOOC学院，然后改变浏览器宽度看MOOC学院网页的响应（变化）。
除了第一附图和最后一幅图说明的不是响应上面的问题，其余的都是【媒体查询】——响应式设计上面的问题。
–
- 什么是媒体查询？
- 哪些网站采用了响应式设计？
- 它简单的语法什么样？
- MOOC学院以上的这些Bug该如何修复？
学完 Codecademy 上面 HTML & CSS
这门课，再看下
这个CSS布局教程，以及这个媒体查询的文档，你也会调试这些
Bug。
–
相关笔记
本文由果壳MOOC学院网站(mooc.guokr.com)导出，发帖用户为JING-TIME。
