Z-index полоса внутри обертки видна на всей странице - PullRequest
0 голосов
/ 17 марта 2020

Я хотел бы получить результат синей полосы на картинке ниже. Он внутри оболочки, поэтому HTML выглядит так:

    <body>
<div class="wrapper">
<div class="strap"></div>
</div>
</body>

Я знаю, что это сделано с помощью z-index. Ремешок должен быть виден на всей странице. Спасибо за помощь enter image description here

Ответы [ 2 ]

0 голосов
/ 17 марта 2020

Используйте следующее CSS. Код устанавливает абсолютную позицию и затем помещает каждую точку div в каждый угол окна, сверху, снизу, слева и справа. Z-index выведет его на передний план. Убедитесь, что нет других элементов, использующих z-index со значением больше 99. Затем цвет фона устанавливается как белый с прозрачностью 40%; Отрегулируйте 0,6 до того, что вам нужно. 0,8 например будет менее прозрачным.

.strap{ 
display: block;
position: absolute;
top: 0;
bottom:0;
left:0;
right:0;
z-index:99;
background-color: rgba(255,255,255,0.6);
}
0 голосов
/ 17 марта 2020

Используйте абсолютную позицию атрибута css и используйте верхнюю, правую, левую и нижнюю часть для выравнивания. И используйте z index, чтобы он появился поверх этой оболочки, убедитесь, что ширина равна 100% ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...