Пример:
Обычное зачеркивание в контексте и вариант зачеркивания с применением стилей
Обычное зачеркивание в заголовке и стилизованное
Старая цена 5000 рублей, а со стилями 5000
CSS:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
del { position: relative; text-decoration: none; } del:before { content: ""; width: 100%; height: 0.1em; background: #db7d76; position: absolute; top: 50%; left: 0; transform: rotate(-1deg); } |
Линию перечеркивания можно настроить по своему вкусу. Изменить ее цвет, толщину, наклон или даже наложить анимацию или ховер эффект.
Пример с hover ховер эффектом, чтобы лучше было видно то, что зачеркнули.
|
1 2 3 |
del:hover:before { top: 0; } |
Добавить комментарий: