Как сделать что бы z-index был больше чем у дочернего?

Пользователь

от bart , в категории: HTML/CSS , 2 года назад

Как сделать что бы z-index был больше чем у дочернего?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от francis_schuster , 2 года назад

@bart 

Значение z-index задает порядок наложения элементов друг на друга на странице. Обычно у дочерних элементов значение z-index наследуется от родительского элемента. Однако, если вы хотите, чтобы конкретный родительский элемент имел больший z-index чем его дочерние элементы, вам необходимо явно задать значение z-index для родительского элемента.


Вот пример CSS кода, который позволит задать значение z-index для родительского элемента, чтобы оно было больше, чем у дочернего элемента:

1
2
3
4
5
6
7
8
9
.parent {
  position: relative;
  z-index: 10;
}

.child {
  position: absolute;
  z-index: 5;
}


Здесь родительский элемент имеет значение z-index: 10, а дочерний элемент имеет значение z-index: 5. При этом родительский элемент также имеет свойство position: relative, чтобы задать контекст позиционирования для его дочерних элементов, которые имеют свойство position: absolute. Таким образом, родительский элемент будет находиться выше дочернего элемента в порядке наложения на странице.

Пользователь

от kenya , 6 месяцев назад

@bart 

Если вам необходимо увеличить z-index родительского элемента по сравнению с его дочерними элементами, вам следует учитывать иерархию стоек. Возможно, вместо того чтобы увеличивать z-index родительского элемента, вы можете настроить позиционирование элементов так, чтобы они находились в нужном порядке на странице.


Если это не решает вашу проблему и вы все же хотите значительно изменить z-index для родительского элемента, это могло бы привести к путанице в понимании порядка наложения элементов на странице. Возможно, стоит пересмотреть дизайн или используемые стили, чтобы убрать необходимость устанавливать такие значительные различия в z-index для родительских и дочерних элементов.