VSCodeExample/index.html at master · chrisramirez461/VSCodeExample · GitHub

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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Home</title>
    <link href="./resources/css/styles.css" rel="stylesheet" type="text/css">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
</head>
<body>
    <header>
      <nav class="navbar navbar-expand-lg bg-light">
        <div class="container-fluid">
          <a class="navbar-brand" href="#"></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 active" aria-current="page" href="index.html">Home</a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="about.html">About</a>
              </li>
            </ul>
          </div>
        </div>
      </nav>
    </header>
     <main class="intro">
      <h1 id="Intro">The Big Three of Anime</h1>
      <div class="container text-center">
        <div class="row">
          <div class="col">
            <div class="card" style="width: 18rem;">
              <img src="/resources/images/artworks-000147894326-4l755a-t500x500.jpg" class="card-img-top" alt="...">
              <div class="card-body">
                <h5 class="card-title">Naruto</h5>
                <p class="card-text">Naruto Uzumaki, a young ninja who seeks recognition from his peers and dreams of becoming the Hokage, the leader of his village. The story is told in two parts. the first set in Naruto's pre-teen years, and the second in his teens.</p>
                <a href="naruto.html" class="btn btn-primary">Learn More</a>
              </div>
            </div>
          </div>
          <div class="col">
            <div class="card" style="width: 18rem;">
              <img src="/resources/images/artworks-000063045618-6ixqlq-t500x500.jpg" class="card-img-top" alt="...">
              <div class="card-body">
                <h5 class="card-title">One Piece</h5>
                <p class="card-text">The story follows the adventures of Monkey D. Luffy, a boy whose body gained the properties of rubber after unintentionally eating a Devil Fruit. With his crew of pirates, named the Straw Hat Pirates, Luffy explores the Grand Line in search of the world's ultimate treasure known as "One Piece" in order to become the next Pirate King.</p>
                <a href="onepiece.html" class="btn btn-primary">Learn More</a>
              </div>
            </div>
          </div>
          <div class="col">
            <div class="card" style="width: 18rem;">
              <img src="/resources/images/df66cti-2020e23a-1f96-42d5-8740-e22134036a40.png" class="card-img-top" alt="...">
              <div class="card-body">
                <h5 class="card-title">Bleach</h5>
                <p class="card-text">High school student Ichigo Kurosaki becomes a substitute Soul Reaper, when Rukia Kuchiki risks her life to protect him from a Hollow. </p>
                <a href="bleach.html" class="btn btn-primary">Learn More</a>
              </div>
            </div>
          </div>
        </div>
      </div>


     </main>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
</body>
</html>