display:flex 是一种布局方式。它即可以应用于容器中，也可以应用于行内元素。是W3C提出的一种新的方案，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持。
flex-direction:column; 让元素沿垂直主轴从上到下垂直排列
.navbar{background：white}：导航栏背景颜色为白色
.navbar .item：对导航栏中字体的设置，以及导航栏内元素空间如何分配
flex: auto：导航栏内元素空间弹性分配
flex:1 ：导航栏内元素空间等分
{
position: relative;相对定位
position: absolute;绝对定位
例如先 relative 后absolute，则absolute的部分根据relative进行定位
}
.navbar .item.active：导航栏里的字体颜色
.navbar .item.active:after：选中导航栏中的某一栏是，这一栏下边界所显得颜色
来源：oschina
链接：https://my.oschina.net/u/4412439/blog/4267513