Розробка, підтримка, SEO, просування, соцмережі та реклама сайтів ☣
Кабінет клієнта
Зареєструватись Забули пароль?
Створення та оптимізація сайтів » Блог » css » Як змінити один блок при наведенні на інший

Як змінити один блок при наведенні на інший

Створюю і просуваю комерційні сайти та інтернет-магазини з 2008 року. 11-06-2016, 18:00 770 0
Як змінити один блок при наведенні на інший

Іноді потрібно змінити один блок коли наводиться курсор на іншу силку чи блок.

У css можна міняти - наступний в тому-ж рівні вкладеності (+) один із таких в тому-ж рівні вкладеності (~) безпосереднього нащадка ">" і будь-якого нащадка "".

 

Увага! батьків і попередні елементи міняти не можна.

 


<div class="hoverme">Наведи на меня
<div class="test"></div>
<div><div class="test"></div> </div>
</div>
<div class="test"></div>
<hr/>
<div class="test"></div>

 


div {
margin-left: 10px;
}
.test:before {
content: "не навів";
}
.hoverme:hover .test:before {
content: " я внук";
}
.hoverme:hover > .test:before {
content: "> я дитина";
}
.hoverme:hover ~ .test:before {
content: "~ я сусід";
}
.hoverme:hover + .test:before {
content: "+ я наступний";
}

 

 
 


Коментарі

⤹ Залишити свій коментар ⤸

  • оновити, якщо не видно коду

Тарифні плани

Потужний старт Стандартний запуск сайту від $400
  • - ♜ -
  • В стартовий тарифний план входить:

  • Розробка та налаштування сайту
  • Семантичне ядро
  • Оптимізація швидкості
  • Наповнення до SEO 5 сторінок
  • Ліцензія двигунчика DLE
Просунутий SEO оптимізований сайт від $700
  • - ♚ -
  • В SEO тарифний план входить:

  • Створення та налаштування сайту
  • Семантичне ядро
  • Оптимізація швидкості
  • Наповнення до SEO 10 сторінок
  • Ліцензія двигунчика DLE
  • 5 силок + перелінковка
Імперський винущувач конкурентів від $999
  • - ♛ -
  • В імперський тарифний план входить:

  • Розробка сайту
  • Наповнення до SEO 20 сторінок
  • Повна оптимізація
  • Ліцензія двигунчика DLE
  • МОЄ НАТХНЕННЯ та ДОСВІД!
/* soc-knopki */