Что делает > угловая скобка в CSS??

89

Leonid H

11 июня 2018, 13:10

3028

	&:hover > .search-btn {

		background: #fff;

	}

Как называются подобные символы и какие есть еще??

1

369

Samail

11 июня 2018, 13:22

#1

https://developer.mozilla.org/ru/docs/Web/CSS/Reference#Selectors

1

59

Staid

11 июня 2018, 13:22

#2

Это означает, что стиль применится непосредственно к прямому дочернему элементу. К примеру так сработает:

.block:hover > .search-btn {
background: #fff;
}

Так уже нет:

2

1762

LEOnidUKG

11 июня 2018, 13:46

#3

&:hover

А & что значит в начале?

---------- Добавлено 11.06.2018 в 16:48 ----------

Кстати такой стиль вёрстки, привязки двух стилей друг к другу, это так бесит. Особенно когда нужно например сделать вторую кнопку рядом, НО НЕТ, верстальщик придумал, что вот обязательно надо привязать два стиля, хотя это в 99% нафиг не нужно и первый блок зачастую просто пустой без стилей вообще.

✅ Мой Телеграм канал по SEO, оптимизации сайтов и серверов: https://t.me/leonidukgLIVE ✅ Качественное и рабочее размещение SEO статей СНГ и Бурж: https://getmanylinks.ru/ ✅ Настройка и оптимизация серверов https://getmanyspeed.ru/

Отвечу на ваши вопросы Фильтр малополезный контент - Как мы пишем самые

59

Staid

11 июня 2018, 13:49

#4

LEOnidUKG:
А & что значит в начале?

Я тоже впервые вижу такое, наверно опечатка.

247

altezzik

11 июня 2018, 14:14

#5

LEOnidUKG:
&:hover

А & что значит в начале?

Это из LESS/SASS. Типа такого должно быть



.style-name {
color:#cc0000;

  &:hover {
    color:#000;
  }
}

Чтобы не печатать .style-name второй раз.

3

1762

LEOnidUKG

11 июня 2018, 14:23

#6

Это из LESS/SASS. Типа такого должно быть

Хм, прикольно, не знал.

436

sergv

11 июня 2018, 18:13

#7

Staid:
К примеру так сработает:
<div class="block">
<a href="search-btn"></a>
</div>

Я так полагаю, здесь ошибка и сработать оно должно не как написано, а вот так:

?

1

https://REGHOME.ru - регистрация и продление доменов от 169₽ в российских и международных зонах по честным ценам без звездочек. (R01, WebNames, UK2). Принимаем Ю-Money, Visa, MasterCard, Мир

59

Staid

11 июня 2018, 19:59

#8

sergv, второпях ошибся. Конечно же правильно <a href="#" class="search-btn"></a>

1

112

Ваано

11 июня 2018, 20:06

#9

Познавательная тема, отстал от жизни в CSS :o

Staid:
sergv, второпях ошибся. Конечно же правильно <a href="#" class="search-btn"></a>

Так и каким в итоге код должен быть? Какой там первый символ вместо "&" ?

Туры в Мексику тут (http://www.metmexico.com). Оптимальное отношение цена/качество.

369

Samail

11 июня 2018, 23:11

#10

Ваано:
Какой там первый символ вместо "&" ?

У ТС код не весь приведён, поэтому мы не знаем какой там родительский селектор.

http://sass-lang.com/documentation/file.SASS_REFERENCE.html#parent-selector

Переиграть и победить: как анализировать конкурентов для продвижения сайта

В 2023 году Google заблокировал более 170 млн фальшивых отзывов на Картах