再去添加一个选择器 ..

.menu

用一个 margin-left .. 给它添加一个左边儿的外边距 .. 值可以是 56px ..

然后再去设计一下菜单项的样式 .. 选择器可以使用 .menu .item .. 表示在 .menu 元素里面出现的 .item 元素 ..

先用一下 display 属性 .. 设置成 inline-block ... 让元素成为 inline 类型的块级元素 .. 这种块级元素会在同一排显示 ..

默认情况下 ... a 标签并不是块级元素，它属于行内元素 ..

再设置一下菜单项文字的大小 .. font-size .. 设置成 18px .. 然后是它的颜色 .. 用的是 color 属性，它的值是黑色 ..

再添加一个左边的外边距 .. margin-left .. 24px ... 右边也要有个边距 .. 用的是 margin-right .. 值同样可以是 24px ..

然后在添加一个下边儿的内边距，padding 表示内边距，padding-bottom 表示元素下边儿的内边距 .. 值可以是 32px

再用一个 padding-top ，添加一个上边儿的内边距 .. 值可以是 24px ..

激活菜单项的上面有个 .active 类，我们可以单独为这个类添加点特别的样式，让带这个类的菜单项的样式跟其它的菜单项的样式区分一下 ..

样式选择器可以是 .menu .item.active .. 元素上要包含 .item.active 这两个类，并且这个元素在 .menu 元素的里边儿..

在我们的设计里激活菜单项的下面有一个黑色的边框 .. 设置这种样式用的属性是 border-bottom ，表示下边的边框 .. 它的值是一个组合值 .. 2px solid #000 ，表示边框的大小是 2px ，solid 表示实线，#000 表示边框的颜色 ..