-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
99 lines (98 loc) · 4.84 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<!DOCTYPE html>
<head>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<title>Fahrian Ramaditiya - INPG-KS03-002</title>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light shadow p-3">
<div class="container-fluid mx-5">
<a class="navbar-brand" href="#">Hacktiv8</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-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">
<li class="nav-item">
<a class="nav-link" aria-current="page" href="index.html">Profil</a>
</li>
<li class="nav-item">
<a class="nav-link" href="porto.html">Portofolio</a>
</li>
<li class="nav-item">
<a class="nav-link" href="blog.html">Blog</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Tutorial
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">HTML</a></li>
<li><a class="dropdown-item" href="#">CSS</a></li>
<!-- <li><hr class="dropdown-divider"></li> -->
<li><a class="dropdown-item" href="#">Javascript</a></li>
<li><a class="dropdown-item" href="#">JQuery</a></li>
<li><a class="dropdown-item" href="#">Codeigniter</a></li>
</ul>
</li>
</ul>
<div class="ms-auto">
<div class="navbar-nav">
<div class="nav-item">
<a class="nav-link" href="#">Login</a>
</div>
<div class="nav-item">
<button class="btn btn-primary">Daftar</button>
</div>
</div>
</div>
</div>
</div>
</nav>
<div class="card text-center my-4 shadow p-3">
<div class="card-body">
<div class="my-5">
<h2 class="card-title fw-bold">Selamat datang di www.hacktiv8.com!</h2>
<h5 class="card-text mb-5">Tutorial pemrograman bahasa Indonesia terlengkap di muka bumi.</h5>
<a href="#" class="btn btn-primary">Mulai Belajar !</a>
</div>
</div>
</div>
<div class="row my-auto">
<div class="card shadow p-3 mx-auto" style="width: 18rem;">
<img src="images/jquery.png" class="card-img-top" alt="...">
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
</div>
<div class="card shadow p-3 mx-auto" style="width: 18rem;">
<img src="images/jquery.png" class="card-img-top" alt="...">
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
</div>
<div class="card shadow p-3 mx-auto" style="width: 18rem;">
<img src="images/jquery.png" class="card-img-top" alt="...">
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
</div>
<div class="card shadow p-3 mx-auto" style="width: 18rem;">
<img src="images/jquery.png" class="card-img-top" alt="...">
<div class="card-body">
<p class="card-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
</div>
</div>
<div class="d-flex justify-content-between card-footer mt-5">
<p class="text-muted mx-5">
Copyright (c) 2018 Web Dev Team
</p>
<p class="text-muted mx-5">
Design By Hacktiv8
</p>
</div>
</body>
<footer>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
</footer>
</html>