отображать: встроенный блок;и отображать: нет;Не работает для замены текста при наведении - PullRequest
0 голосов
/ 07 октября 2019

Я работал над небольшим сайтом, полным игр, для удобства, и я попытался поместить небольшое сообщение, чтобы оно появлялось, когда мышь наводит курсор на ссылки. Мой код для html выглядит следующим образом в html:

<li><a href="game1.html"><span class="games">Text normally</span><span class="hovergames">Text displayed on hover.</span></a></li>

И в style.css код выглядит следующим образом:

.hovergames{background-color:#242423; a:hover.games{display:none;} a:hover.hovergames{display:inline-block;} a.hovergames{display:none;}

Моя цель - попытаться получить "текст, отображаемый наhover ", чтобы появиться на hover вместо" text normal ", и это не работает. Могу ли я что-нибудь сделать, чтобы текст не отображал оба?

1 Ответ

0 голосов
/ 07 октября 2019

.hovergames {
  display: none;
}

a:hover .hovergames {
  display: block;
}

a:hover .games {
  display: none;
}

a {
  display: inline-block;
}
<li><a href="game1.html"><span class="games">Text normally</span><span class="hovergames">Text displayed on hover.</span></a></li>
...