🏠 | 💻  IT | CSS |

Псевдоэлемент before в виде стрелки

Это самый простой способ без отрисовки сложного CSS

Пример

CSS

Создадим класс для ссылки .read и псевдокласс .read::before в который просто положим ❯❯ в параметр content

.read { border-left: 2px solid #502542; border-bottom: 1px dashed #502542; border-top: 1px dashed #502542; width:100%; padding-left:2rem; padding-top: 1rem; padding-bottom: 1rem; } .read::before { color:#502542; margin-left:-1.5rem; margin-right:1rem; content: "❯❯"; }

HTML

<a class="read" href="https://tp.media/r?marker=201961&p=4114&u=https%3A%2F%2Faviasales.ru"> Aviasales: Лучшие цены на авиабилеты </a> <br> <br> <a class="read" href="https://tp.media/r?marker=201961&p=3460&u=https%3A%2F%2Fwww.flixbus.ru%2F"> Flixbus: Автобусные билеты по всей Европе </a>

Результат

Aviasales: Лучшие цены на авиабилеты

Flixbus: Автобусные билеты по всей Европе

Статьи о CSS
Обтекание одного блока другим
Автоматическая нумерация строк таблицы
Share in social media: