<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Hello, world!</title>
<meta name="viewport" content="width=device-width,initial-scale=1" />
<meta name="description" content="" />
<link href="https://cdn.jsdelivr.net/npm/modern-normalize@v3.0.0/modern-normalize.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
<link rel="apple-touch-icon" type="image/png" sizes="180x180" href="apple-touch-icon.png">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<meta name="theme-color" content="">
<meta property="og:title" content="" />
<meta property="og:description" content="" />
<meta property="og:image" content="" />
<meta name="twitter:card" content="" />
<meta name="twitter:site" content="" />
<meta name="twitter:title" content="" />
<meta name="twitter:description" content="" />
<meta name="twitter:image" content="" />
<link rel="manifest" href="manifest.webmanifest">
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-XXXXXXXXXX');
</script>
</head>
<body>
<div id="fadein" class="position-fixed top-0 start-0 w-100 h-100 bg-white" style="animation: fadeinall 1s normal 0.3s both;"></div>
<style>
/* For best practice, move CSS below to an external CSS file. */
@keyframes fadeinall {
0% { opacity: 1; }
97% { opacity: 0; }
98% {
opacity: 0;
-webkit-transform: translateY(0);
transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
z-index: -1;
}
}
</style>
<div id="loader-wrapper" class="bg-white position-fixed top-0 z-3 w-100 h-100 text-center">
<div class="spinner-border mt-5" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<header>
<h1>Hello, world!</h1>
</header>
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="container-fluid">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavDropdown">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Dropdown link
</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li><a class="dropdown-item" href="#">Something else here</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do.</p>
<img src="https://via.placeholder.com/800x600/" alt="">
<main>
<section></section>
<section></section>
<section></section>
</main>
<form action="#">
<label for="firstName" class="form-label">First name:</label><br>
<input type="text" class="form-control" name="firstName" value="John"><br>
<label for="lastName" class="form-label">Last name:</label><br>
<input type="text" class="form-control" name="lastName" value="Doe"><br>
<label for="email" class="form-label">Email:</label><br>
<input type="email" class="form-control" name="email" value="john@example.com"><br>
<label for="message" class="form-label">Message:</label><br>
<textarea class="form-control" name="message"></textarea><br>
<input type="submit" class="btn btn-primary" value="Submit">
</form>
<footer></footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
Matthias
Van de
Voorde
Web Developer & Designer
Creating seamless, beautiful digital experiences.
Get to know me