设计：导航 - 移动端
在《 网站 》这个系列里面，我们会一起设计与制作一些页面上常用的界面元素，导航是页面上必备的元素之一。主导航的功能就是展示网站的内容结构， 它是用户访问网站不同区域的一个入口。这一集会先使用设计工具，设计导航在桌面设备与移动设备上的样子。课程后半部分介绍了使用 sass 创建的样式。
导航栏在桌面尺寸的设备上会显示在页面的顶部，导航栏上一般会有标志，菜单，还有一些工具，比如搜索或登录。我们设计的导航栏有两个状态，一个是正常状态，还有一个是搜索状态，就是点击导航栏上的搜索图标以后，会把导航栏上的标志与菜单隐藏起来，显示一个搜索框。
导航栏在小尺寸移动设备上有不同的样式，导航栏上的菜单会被隐藏起来，导航栏左边会显示一个菜单图标（汉堡包），点击这个菜单图标会在页面左侧显示一个边栏，边栏上的内容就是导航栏上的菜单。在下一集，我们会介绍使用代码的形式表示这个导航栏的方法。
这一集后半部分会介绍到 sass ，它是一种增强型的 css。在宁皓网你可以找到一个专门的课程介绍了使用 sass 创建样式的方法。有时间先去练习一下这个 sass 课程。sass 文件有两种格式，scss 与 sass，我用的是 scss，在 scss 格式的样式文件里，你可以使用普通的 css ，完全不用考虑 sass 是怎么回事，如果你愿意，可以加入 sass 提供的一些功能，比如样式的嵌套，使用变量，mixin 等等，但这不是必须的。
跟 sass 类似的还有 less，我们在课程里用的 semantic ui 这套样式框架就是用 less 这种格式写的，less 与 sass 的用法与思想都差不多，了解其中的一个，你也很容易学会用另一个。在项目里，我已经配置好了让项目支持 sass ，项目里的自动化任务，会把你写的 sass 格式的样式编译成普通的 css 。
课程更新
