html_css_project/index.html at master · sidaaryan7/html_css_project · 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
<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <link rel="stylesheet" href="styles.css">
        <title>marioclub</title>
    </head>
<body>
    <header>
        <h1>marioclub</h1>
    </header>
<section class="banner">
    <img src="img/banner.png" alt="marioclub welcome banner">
    <div class="welcome">
        <h2>welcome to <br><span>MarioClub</span></h2>

    </div>
</section>

<nav class="main-nava">
    <ul>
        <li><a href="" class="join">join the club</a> </li>
        <li><a href="">latest news</a></li>
        <li><a href=""> new games</a></li>
        <li><a href="">conatct</a></li>
    </ul>

</nav>

<main>
    <article>
        <h2>It's me,Mario</h2>
        <p>

                Lorem ipsum dolor sit amet, consectetur adipiscing elit,
                sed do eiusmod tempor incididunt ut labore et dolore mag
                na aliqua. Purus in massa tempor nec feugiat nisl. Nulla
                at volutpat diam ut venenatis tellus in metus. Tristique
                risus nec feugiat in fermentum posuere urna nec tincidunt.
                Libero nunc consequat interdum varius sit amet mattis vul
                putate enim. Rutrum quisque non tellus orci ac. Dui ut or
                nare lectus sit amet est. Risus at ultrices mi tempus imp
                erdiet nulla. Rhoncus est pellentesque elit ullamcorper d
        </p>
    </article>
    <ul class="images">
        <li><img src="img/thumb-1.png" alt="mario thumb 1"></li>
        <li><img src="img/thumb-2.png" alt="mario thumb 2"></li>
    </ul>

</main>

<section class="join">
    <h2>Join Today</h2>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit,
       sed do eiusmod tempor incididunt ut labore et dolore mag
       na aliqua. Purus in massa tempor nec feugiat nisl. Nulla</p>

    <form action="">
        <input type="email" name="email" placeholder="type email & hit enter" required>

    </form>

</section>

<footer>
    <p class="copyright">Copyright 2019 Mario Club</p>
</footer>
</body>

</html>