Раньше для мигания текста применялся специальный элемент <blink>, но браузеры уже его не поддерживают и считают устаревшим. Теперь для тех же целей используется свойство animation, позволяющее плавно изменять значения стилевых свойств за указанное время.
Для создания мигания создадим класс blink и для него установим бесконечно повторяющуюся анимацию через параметр infinite. Само мигание происходит через свойство opacity, за счёт изменения прозрачности текста от 1 до 0, как показано в примере 1.
Пример 1. Мигающий текст
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Мигание</title>
<style>
.blink {
animation: blink 2s infinite; /* Параметры анимации */
}
@keyframes blink {
from { opacity: 1; /* Непрозрачный текст */ }
to { opacity: 0; /* Прозрачный текст */ }
}
</style>
</head>
<body>
<p class="blink">Внимание</p>
</body>
</html>
Здесь время мигания установлено две секунды, это значение можно увеличивать или уменьшать по своему усмотрению.