Z-индекс, вид и видимость

Ответы на вопросы

1. Абсолютно позиционированные блоки перекрывают друг друга. Какой блок оказывается “выше”?

   Ответ. Если для блоков не задано свойство z-index , “выше” располагается тот блок, код которого в HTML идёт позже.

2. Каким свойством можно управлять расположение блоков по “высоте”, какие может принимать значения, как работает и передаётся ли по наследству?

   Ответ. В CSS существует способ для явного управления взаимным положением элементов по высоте (по оси Z, которая направлена к читателю, перпендикулярно плоскости страницы). Это свойство z-index.

   В качестве значения z-index может выступать любое целое, в том числе и отрицательные числа. Значение auto эквивалентно значению 0. Элемент, значение z-index которого больше, располагается ближе к читателю. По наследству свойство не передаётся.

3. Какому значению свойства z-index соответствует расположение непозиционированных элементов?

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

4. При помощи какого свойства можно управлять видимостью элемента? Какие значения может принимать это свойство, как эти значения работают, передается ли свойство по наследству?

   Ответ. Видимостью элемента на экране позволяет управлять свойство visibility. Это свойство может принимать значение visible (элемент виден) или значение hidden (элемент не виден). Свойство применимо ко всем элементам и передаётся по наследству.

5. В чём отличие действия правила visibility:hidden от действия правила display:none?

   Ответ. Правило visibility:hidden делает элемент невидимым, но сохраняет его место на экране, правило display:none убирает элемент из документа, остальные элементы занимают его место.

6. Может ли элемент STRONG внутри абзаца, для которого задано visibility:hidden, быть видимым?

   Ответ. Да, если для него указать правило visibility:visible. Если этого не сделать, элемент STRONG будет невидимым, так как ему передается по наследству от абзаца правило visibility:hidden.

7. Каким свойством можно изменить поведение элемента: “превратить” его в блочный, строчный, пункт списка или вообще удалить с экрана? Какие значения может принимать это свойства? Передаётся ли свойство по наследству?

   Ответ. При помощи свойства display элемент можно “превратить” в блочный (значение block), в строчный (значение inline), пункт списка (значение list-item) или вообще удалить с экрана (значение none). Свойство применимо ко всем элементам и по наследству не передаётся.

8. Может ли строчный элемент, “превращённый” в блочный, содержать внутри себя блочные элементы?

   Ответ. Нет. Изменение ролей свойством display не меняет тип элемента, меняет только его представление на экране. В частности, по-прежнему блочные элементы не могут быть потомками строчных.

вверх | возврат