Регистрация Войти
Войти через VK Войти через FB Войти через Google Войти через Яндекс
Войти через VK Войти через FB Войти через Google Войти через Яндекс
Поиск по сайту
Наш чат в Telegram для обмена идеями, проектами, мыслями, людьми в сфере ИТ г.Ростова-на-Дону: @it_rostov
Зафиксированный на экране блок
Для просмотра эффекта фиксации блока воспользуйтесь прокруткой страницы
Этот блок зафиксирован в потоке вывода
Этот блок зафиксирован относительно низа рабочей области экрана
Этот блок зафиксирован относительно верха рабочей области экрана
Исходный код этого примера:
<style>
[class*="Banner"] {
position: fixed;
height: auto;
width: 200px;
padding: 10px;
text-align: left;
background-color: #77F5FE;
border: solid 1px;
}
.Banner {
border-color: red;
}
.Banner-top {
border-color: blue;
top: 130px;
left: 30px;
}
.Banner-bottom {
border-color: green;
bottom: 4px;
right: 10px;
}
</style>
<div class="Banner">Этот блок зафиксирован в потоке вывода</div>
<div class="Banner-bottom">Этот блок зафиксирован относительно низа рабочей области экрана</div>
<div class="Banner-top">Этот блок зафиксирован относительно верха рабочей области экрана</div>
.
Прокомментировать/Отблагодарить