今天完成的事情：任务八只写了一个头部。看了一下bootstrap的折叠面板和导航栏。

明天计划的事情：写完任务八的轮播图。尽量多写一点。

遇到的问题： 遇到问题有点多，bootstrap的布局还是不太了解。还有一些标签属性。导航栏里面的选项怎么和logo左右分开，我试了justify-content:space-between;没有生效。再就是“首页 职业”居中问题。不知道应在哪里设置什么样的代码。正在一层层实验。

收获：

折叠面板(Collapse)

Bootstrap折叠板插件允许你在网页中用一点点JavaScript以及CSS类切换内容，控制内容的可见性。它是一个灵活的插件，使用少量的类（来自必需的过渡插件），以方便切换行为。

• .collapse 隐藏内容
• .collapsing 带动态效果的切换
• .collapse.show 显示内容

你可以使用带href 属性的连接,、或者带 data-target 属性的按钮来创建折叠效果-这两种情况下 data-toggle="collapse" 属性都是必须的。

导航栏(navbar)

导航栏是一个将商标、导航以及别的元素简单放置到一个简洁导航页头的容器代码组合，它很容易扩展，而且在折叠板插件的帮助下，它可以轻松与其它内容整合。

• 导航栏需要使用.navbar 来定义，并使用 .navbar-expand{-sm|-md|-lg|-xl} 用于响应式布局以及使用配色方案Class 。
• 导航栏默认内容是流式的，使用 containers容喇来限制它们的水平宽度。
• 使用我们提供的 间隙间距 和 flex 布局 classes 来定义导航栏中元素的间距和对齐。
• Navbars导航栏默认支持响应式，在修改上也很容易，你可以使用轻松的来定义它们-这取决于我们提供的 JavaScript 插件。
• 打印时，导航栏默认隐藏。如果需要打印显示，可以加入.d-print 样式到 .navbar中，点此参阅 display块元素 通用 class定义。
• 使用<nav>导航通用元素来确保可访问性（易用性），或者如果使用更通用的元素，例如<div>添加一个role="navigation"，可以为使用者的辅助浏览提供明确标识。

支持的内容

Navbar导航栏内置支持少量子组件。根据需要从以下选择：:

• .navbar-brand 为您的公司，产品或项目名称。
• .navbar-nav 提供完整的高和轻便的导航（包括对下拉菜单的支持）。
• .navbar-toggler 用於我們的折疊插件和其他 navigation toggling 行為。
• .form-inline 用于任何表单控件和操作。
• .navbar-text 用于添加垂直居中的文本字符串。
• .collapse.navbar-collapse用于通过父断点进行分组和隐藏导航列内容。

导航栏上的选项可以使用 <ul> 元素并添加 class="navbar-nav" 类。 然后在 <li> 元素上添加 .nav-item 类， <a> 元素上使用 .nav-link 类:

不同颜色导航栏

可以使用以下类来创建不同颜色导航栏：.bg-primary, .bg-success, .bg-info, .bg-warning, .bg-danger, .bg-secondary, .bg-dark 和 .bg-light)。

提示: 对于暗色背景需要设置文本颜色为浅色的，对于浅色背景需要设置文本颜色为深色的。

导航栏的表单与按钮

导航栏的表单 <form> 元素使用 class="form-inline" 类来排版输入框与按钮：

你也可以使用其他的输入框类，如 .input-group-addon 类用于在输入框前添加小标签。

固定导航栏

导航栏可以固定在头部或者底部。

我们使用 .fixed-top 类来实现导航栏的固定：

.fixed-bottom 类用于设置导航栏固定在底部：

bootstrap row下的flex  只有基本的内容。上下左右位置 还是要自己来定位的吧！多努力 争取下个礼拜五开会的时候做完任务八九。还有媒体查询。看看看.....导航 大屏幕是显示 小屏幕时隐藏。要看。