Фиксированный фон на Bootstrap
Начальный макет Bootstrap 4 с полным фоном с фиксированной фоновой картинкой.
HTML
<!-- Navigation -->
<nav class="navbar navbar-expand-lg navbar-light bg-light static-top mb-5 shadow">
<div class="container">
<a class="navbar-brand" href="#">Start Bootstrap</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home
<span class="sr-only">(current)</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<div class="card border-0 shadow my-5">
<div class="card-body p-5">
<h1 class="font-weight-light">Fixed Full Page Background Image</h1>
<p class="lead">In this snippet, the background image is fixed to the body element. Content on the page will scroll, but the image will remain in a fixed position!</p>
<p class="lead">Scroll down...</p>
<div style="height: 700px"></div>
<p class="lead mb-0">You've reached the end!</p>
</div>
</div>
</div>
CSS/* Set a background image by replacing the URL below */
body {
background: url('https://source.unsplash.com/twukN12EN7c/1920x1080') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
}
Ссылка для скачивания доступна только авторизованным пользователям, пожалуйста пройдите регистрацию.
Это займёт не более минуты. Не волнуйтесь, мы не спамим!
У данной публикации нет комментариев.
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.
Облако тегов
bootstrap Bootstrap css CSS CSS3 DLE dle fruit farm html html шаблон html5 HTML5 Payeer PNG PSD wap Скрипт удвоителя адаптивный адаптивный шаблон бонусник дизайн игровой хостинг иконки лендинг меню модуль панель портфолио сайт скрипт скрипт фермы текстура удвоитель удвоитель Payeer ферма фон фруктовая ферма хак шаблон экономическая игра
Оцените работу движка