У ссылки не меняется цвет при наведении

Мне нужно, чтобы ссылка при наведении плавно становилась полупрозрачной, сделать это нужно с помощью opacity и transition. Я установила свойства, они не работают.

код css

.header__link {
    color: #2f80ed`;
  }

.header__link:hover {
    opacity: 0.4;
    transition: opacity 1s linear 2s;
  }

Ответы (1 шт):

Автор решения: MidNightElf

Свойство transition определяет переход от одного состояние к другому, в вашем случае должен применяться к селектору который записан без псевдокласса

.header__link {
    color: #2f80ed;
    transition: opacity 1s linear 2s; /* К СЕЛЕКТОРУ БЕЗ ПСЕВДОКЛАССА */
  }

.header__link:hover {
    opacity: 0.4;
  }
<a class="header__link">Ссылка</a>

→ Ссылка