CSS3的响应式布局

下面是CSS判断是PC端还是移动端

其实很简单，用CSS3的媒体查询就可以非常方便去实现.

/*最小宽度800就是PC端*/
@media all and (min-width: 800px) {
  .nav {
    float: left;
    margin-right: 20px;
  }
  .nav > li {
    width: 300px;
    float: left;
  }
}
/*最大宽度799就是移动端*/
@media all and (max-width: 799px) {
  .nav {
    width: 100%;
  }
  .nav > li{
    width: 100%;
  }
}

剩下一部分js就根据情况写了（比如菜单的现实隐藏之类的）