采用百分比的形式
“响应式设计（Responsive Design” 是一种让网站针对不同的浏览器和设备“呈现”不同显示效果的策略，这样可以让网站在任何情况下显示的很棒！
媒体查询是做此事所需的最强大的工具。让我们使用百分比宽度来布局，然后在浏览器变窄到无法容纳侧边栏中的菜单时，把布局显示成一列：
@media screen and (min-width:600px) {
nav { float: left; width: 25%; }
section { margin-left: 25%; } }
@media screen and (max-width:599px) {
nav li { display: inline; }
}