Как получить ленту css3 с обеих сторон элемента

Question

Я следую учебнику о том, как сделать ленту CSS. Однако конечный результат показывает ленту только на одной стороне данного элемента. Я задаюсь вопросом: учитывая код в руководстве, есть ли способ заставить его появляться с обеих сторон? Может быть, меня смущают значения :before и :after. Нужно ли добавлять <div> с обеих сторон и нацеливать оба?

Answer 1

Вы можете иметь только один псевдоэлемент :before и :after на элемент, поэтому вам нужно добавить еще одну обертку и стиль с противоположными характеристиками. Я собрал один для вас здесь , основываясь на учебнике, на который вы ссылались.

Чтобы лучше понять псевдоэлементы, просмотр предыдущего моего ответа может быть полезным.