如何在元素的两侧获得css3功能区

Question

我正在关注如何制作CSS功能区tutorial。但是，最终结果仅在给定元素的一侧显示了一条色带。我想知道：鉴于教程中的代码，有没有办法让它出现在双方？也许我对:before和:after的含义感到困惑。我是否需要在任意一侧添加<div>并同时定位两者？

Answer 1

每个元素只能有一个:before和:after个伪元素，因此您需要添加另一个包装器并设置具有相反特征的包装器。我根据您引用的教程为您here整理了一个。

要了解更好的伪元素，viewing a previous answer of mine可能会有所帮助。