JiriZubrycky

Untitled

Jun 17th, 2021
901
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!doctype html>
  2. <html lang="en">
  3.   <head>
  4.     <!-- Required meta tags -->
  5.     <meta charset="utf-8">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  7.  
  8.     <!-- Bootstrap CSS -->
  9.     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
  10.  
  11.     <title>Hello, world!</title>
  12.   </head>
  13.   <body>
  14.     <header>
  15.   <!-- Navbar -->
  16.   <nav class="navbar navbar-expand-lg navbar-light bg-white fixed-top">
  17.     <div class="container-fluid">
  18.       <button
  19.        class="navbar-toggler"
  20.        type="button"
  21.        data-mdb-toggle="collapse"
  22.        data-mdb-target="#navbarExample01"
  23.        aria-controls="navbarExample01"
  24.        aria-expanded="false"
  25.        aria-label="Toggle navigation"
  26.      >
  27.         <i class="fas fa-bars"></i>
  28.       </button>
  29.       <div class="collapse navbar-collapse" id="navbarExample01">
  30.         <ul class="navbar-nav me-auto mb-2 mb-lg-0">
  31.           <li class="nav-item active">
  32.             <a class="nav-link" aria-current="page" href="#">Home</a>
  33.           </li>
  34.           <li class="nav-item">
  35.             <a class="nav-link" href="#">Features</a>
  36.           </li>
  37.           <li class="nav-item">
  38.             <a class="nav-link" href="#">Pricing</a>
  39.           </li>
  40.           <li class="nav-item">
  41.             <a class="nav-link" href="#">About</a>
  42.           </li>
  43.         </ul>
  44.       </div>
  45.     </div>
  46.   </nav>
  47.   <!-- Navbar -->
  48.  
  49.   <!-- Background image -->
  50.   <div
  51.    class="p-5 text-center bg-image"
  52.    style="
  53.      background-image: url('https://mdbcdn.b-cdn.net/img/new/slides/041.jpg');
  54.      height: 400px;
  55.      margin-top: 58px;
  56.    "
  57.  >
  58.     <div class="mask" style="background-color: rgba(0, 0, 0, 0.6);">
  59.       <div class="d-flex justify-content-center align-items-center h-100">
  60.         <div class="text-white">
  61.           <h1 class="mb-3">Heading</h1>
  62.           <h4 class="mb-3">Subheading</h4>
  63.           <a class="btn btn-outline-light btn-lg" href="#!" role="button"
  64.            >Call to action</a
  65.          >
  66.         </div>
  67.       </div>
  68.     </div>
  69.   </div>
  70.   <!-- Background image -->
  71. </header>
  72.  
  73.     <!-- Optional JavaScript -->
  74.     <!-- jQuery first, then Popper.js, then Bootstrap JS -->
  75.     <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
  76.     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
  77.     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
  78.   </body>
  79. </html>
  80.  
RAW Paste Data