Одинаковый стиль в меню для ативного пункта и hover

280
24 апреля 2017, 01:41

Интересует решение на css

Есть несколько пунктов в меню:

<div class='active'>1</div>
<div>2</div>
<div>3</div>

И есть стили:

div:hover{font-weight:600}
.active{font-weight:600}

При наведении на любой пункт, нужно убрать оформление у активного, кроме ситуации, когда на него навели мышкой. Код для примера.

Answer 1

Можно воспользоваться тем фактом, что :hover также возникает на родительском контейнере.

.menu:not(:hover)>.active, 
.menu>div:hover { 
  background-color: teal; 
}
<div class=menu> 
  <div class='active'>1</div> 
  <div>2</div> 
  <div>3</div> 
</div>

ПОСЛЕДНИЕ ВОПРОСЫ
Все вопросы
Подробнее о сайте mario.kiev.ua
ТОП-10
READ ALSO
инкапсуляция, ad hoc полиморфизм и dynamic
c#

инкапсуляция, ad hoc полиморфизм и dynamic

Согласно ответу @Grundy на следующий вопрос :

 415
Структура программы
c#

Структура программы

Как выглядит схема взаимосвязи модулей программы? Нужно нарисовать структуру программы, состоящей из 3 модулейА как она выглядит - не представляю

 332
Модернизация метода Replace() для строки
c#

Модернизация метода Replace() для строки

есть строка с текстом вида "D15 D7 B12 String

 324
Вычесление скорости загрузки файла cSharp WebClient
c#

Вычесление скорости загрузки файла cSharp WebClient

Как измерить скорость загрузки файла при использовании webClientDownloadFileTaskAsync? Предчувствую сильную зависимость вычислений от загруженности...

 345