底部栏的 HTML 结构到位后，我们就可以开始进行样式设计，并使这个底部栏看起来像我们在 Photoshop 中设计的那样。
我们为底部栏创建一个新的 SCSS 文件，因为这样做更有意义，可以保持模块化，而且我们一直在为其他所有内容这样做。我们在底部将其 @import 到主样式表中。
我们使用少量的 RGBa 背景色来使底部栏变暗。Sass 对我们有所帮助，因为你可以在 Sass 中这样做，这非常酷：rgba(black, 0.5)；我们使用内阴影来创建类似搁板的效果。
我们使用左右填充将内容推离边缘。我们需要立即根据当前断点调整填充量。
我们以几乎相同的方式设计底部栏的底部。它只是稍微暗一些，使其看起来更低一层。