Pommegr.github.io/index.html at main · ayoungeun/Pommegr.github.io · 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
77
78
79
80
81
82
83
84
85
86
87
<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=1200">
    <link rel="stylesheet" href="styles.css">
</head>

<body>
    <nav class = "navbar">
        <h1 class = "head-title"> ● Mockup, for portfolio. </h1>
        <ul class="navbar-items">
            <li><a href="#home">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#mockup">Mockup</a></li>
            <li><a href="#mockup">Thank you!</a></li>

        </ul>

    </nav>

        <div class="title">
            <img class="title-pic" src= "./images/title-page.png" alt="title"/>
        </div>

            <object class="circle"></object>

            <div class = "alan">
                <img class="alan-pic" src= "./images/alan_turing.png" alt="title"/>
            </div>

            <div class = "grace">
                <img class="grace-pic" src= "./images/grace_hopper.png" alt="title"/>
            </div>

            <div class = "old-comp">
                <img class="old-pic" src= "./images/old_comp.png" alt="title"/>
            </div>

            <div class="background">
                <img class="background-pic" src= "./images/bacgkround2.png" alt="title"/>
            </div>
            <div class="background-2">
                <img class="background-right" src= "./images/bacgkround2.png" alt="title"/>
            </div>

        <div class = "background-geo">

        </div>

        <div class = "dropdown-content">

        </div>

        <div class="text-box">
            <div class="first-box">
                <p class = "divider">○------------------------○</p>
                <p class = "first-paragraph">Lorem ipsum dolor <span class = "highlight1">sit amet</span>, consectetur adipiscing elit,
                    sed do eiusmod <span class = "highlight2">tempor incididunt ut</span> labore et dolore magna
                    aliqua. Ut enim ad minim veniam, quis <span class = "highlight3">nostrud exercitation </span>
                    ullamco <span class = "highlight1">laboris nisi ut aliquip ex</span> ea commodo consequat.
                    Duis aute irure dolor in <span class = "highlight2">reprehenderit in</span> voluptate velit
                    esse cillum dolore eu fugiat nulla pariatur.

                    <span class = "highlight3">Excepteur sint occaecat cupidatat</span> non proident, sunt in
                    culpa qui officia deserun>t mollit anim id est laborum</p>
                    </div>

                    <div class="second-box">
                    <p class = "second-paragraph">Lorem ipsum dolor sit amet, <span class = "highlight1">consectetur adipiscing</span> elit,
                        sed do eiusmod tempor <span class = "highlight3">incididunt </span>ut labore et dolore magna
                        aliqua. Ut enim ad <span class = "highlight3">minim veniam, quis nostrud exercitation</span>
                        ullamco <span class = "highlight2">laboris nisi ut aliquip</span> ex ea commodo consequat.
                        Duis aute irure dolor in reprehenderit in voluptate velit
                        esse cillum dolore eu <span class = "highlight1">fugiat nulla pariatur</span>.

                        Excepteur sint occaecat cupidatat non proident, sunt in
                        culpa qui officia deserunt mollit anim id est laborum</p>
            </div>
        </div>


</body>


</html>