Skip to content

Instantly share code, notes, and snippets.

@kardolus

kardolus/gist:a3520317742c769842c08431e26edeef

Created May 15, 2024 21:05
Show Gist options
  • Save kardolus/a3520317742c769842c08431e26edeef to your computer and use it in GitHub Desktop.
Save kardolus/a3520317742c769842c08431e26edeef to your computer and use it in GitHub Desktop.
Download ZIP
tapmedia.html
Raw
gistfile1.txt
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>TapMedia</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<style>
body {
font-family: Arial, sans-serif;
}
.hero {
background: url('https://tapmedia.io/your-hero-image.jpg') no-repeat center center;
background-size: cover;
height: 100vh;
color: white;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}
.hero h1 {
font-size: 4rem;
margin-bottom: 0;
}
.hero p {
font-size: 1.5rem;
margin-top: 0.5rem;
}
.services {
padding: 2rem 0;
}
.services .service {
text-align: center;
padding: 1rem;
}
.footer {
background-color: #343a40;
color: white;
padding: 1rem 0;
text-align: center;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="#">TapMedia</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ml-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Portfolio</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact</a>
</li>
</ul>
</div>
</nav>
<section class="hero">
<div class="container">
<h1>Welcome to TapMedia</h1>
<p>Your partner in media solutions</p>
<a href="#" class="btn btn-primary btn-lg mt-3">Learn More</a>
</div>
</section>
<section class="services">
<div class="container">
<h2 class="text-center">Our Services</h2>
<div class="row">
<div class="col-md-4 service">
<h3>Content Creation</h3>
<p>We create engaging content that captivates your audience.</p>
</div>
<div class="col-md-4 service">
<h3>Media Strategy</h3>
<p>Our strategies ensure your media reaches the right audience.</p>
</div>
<div class="col-md-4 service">
<h3>Analytics</h3>
<p>We provide detailed analytics to measure your success.</p>
</div>
</div>
</div>
</section>
<footer class="footer">
<div class="container">
<p>&copy; 2024 TapMedia. All rights reserved.</p>
<p><a href="#" class="text-light">Privacy Policy</a> | <a href="#" class="text-light">Terms of Service</a></p>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.3/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment