样式应该与以下代码段一样。
最终结果是一个拥有三个不同版本导航菜单的页面。当发现对于每个特定的浏览器窗口尺寸都有菜单的一个优化版本时，你的观众将会感到惊讶。你可以在以下截图中看到这些神奇的导航元素。
工作原理
每个导航版本应用了CSS3的媒介查询属性来最大限度地提高菜单和内容的可用空间。在最小的窗口中（即小于801px），导航整齐地排列在select表单元素中。在中等尺寸的窗口中（介于801～1024px），导航是内联的并且横跨页面顶部，内容紧跟着导航。最后，对于最宽的浏览器窗口，导航浮动到了左边并且只占横屏宽度的20%，而内容在宽屏浏览器窗口剩余的80%（右边）中保持最大化。需要更多的计划和努力才能实现该技术，但是值得用它为你的用户提供尽可能最佳的视角。
