monkey/haki.html at main · dillu2003/monkey · 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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .nav1{
            position: relative;
            height: 125px;
            width: 100%;
            background-color: grey;
            display: flex;
            align-items: center;
        }
        .im{
            height: auto;
            width: 100px;
        }
        .im img{
            position: relative;
            left: 20px;
            height: auto;
            width: 100px;
        }
        .nav1 h1{
            position: relative;
            left: 20px;
            color: white;
        }
        .nav2{
            position: relative;
            top: 3px;
            background-color: grey;
            height: 40px;
            width: 100%;
        }
        .lo{
            height: 40px;
            display: flex;
            justify-content: space-around;
            align-items: center;
            text-decoration: none;
        }
        .lo a{
            height: 40px;
            width: 20%;
            display: flex;
            justify-content: center;
            align-items: center;
            text-decoration: none;
            color: white;
        }
        .lo a:hover{
            background-color: red;
            color: white;
            cursor: pointer;
        }
        .con{
            display: flex;
            flex-direction: column;
            text-align: center;
        }
        .con p{
            font-size: 15px;
        }
        footer{
            position: relative;
            top: 100px;
            height: 200px;
            width: 100%;
            display: flex;
            justify-content: space-around;
            align-items: center;
            background-color: grey;
            color: white;
        }
        .usedl ul{
            position: relative;
            top: 10px;
            list-style-type: none;
            text-align: center;
            font-size: small;
        }
        .soc{
            position: relative;
            bottom: 15px;
        }
        .soc ul{
            position: relative;
            top: 10px;
            list-style-type: none;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .middle h5{
            position: relative;
            top: 13px;
        }
        .middle{
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
        form{
            position: relative;
            text-align: center;
        }
        .middle .mai input{
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            position: relative;
            top: 30px;
            height: 30px;
            width: 200px;
            font-size: 10px;
            text-align: center;
        }
        .middle .mai button{
            position: relative;
            top: 50px;
            border: 2px solid white;
            border-radius: 20px;
            font-size: 10px;
            height: 30px;
            width: 100px;
            color: white;
            background-color: grey;
        }
        button:hover{
            cursor: pointer;
        }

    </style>
</head>
<body>
    <div class="main"></div>
        <div class="nav1">
            <a class="im" href="./index.html" id="img1"><img src="./monkey.png" alt="noimg"></a>
            <h1 id="on">Haki</h1>
        </div>
        <div class="nav2">
            <ul class="lo"">
                <a href="./devilf.html">Devil Fruit</a>
                <a href="./trans.html">Transformations</a>
                <a href="./haki.html">Haki</a>
                <a href="./contus.html">Contact Us</a>
                <a href="https://www.google.com/">Help</a>
            </ul>
        </div>
        <div class="con">
            <h1>What is Haki?</h1>
            <p>Haki is a mysterious power that allows the user to utilize their own spiritual energy for various purposes. All living beings in the world are capable of learning Haki; however, most people do not notice it or fail to awaken it. Haki users are common in the New World, rare in Paradise, and basically non-existent in the Four Blues.There are three different types of Haki that can be used to sense people's spiritual energy and predict their actions, give the user a protective coating of spiritual energy, and, for a certain group of "chosen ones", overpower the willpower of others.</p>
            <h1>Observation Haki</h1>
            <p>Observation Haki, which gives the user a sixth sense of the world around them, allowing them to sense the presence, strength, and emotions of other people, even if they are out of sight or far away. It also grants limited precognitive abilities, allowing the user to sense their opponents' intentions and predict their actions and attacks before they happen. An advanced level of observation allows the user to actually foresee a short period into the future. Luffy's ability raches to the advanced observation where he can see some seconds to the future.</p>
            <h1>Armament Haki</h1>
            <p>Armament Haki, which allows the user to use their own spiritual energy as armor to defend against attacks, as well as make their own attacks more potent. It can also be used to bypass Devil Fruit defenses, such as Logia intangibility. A person can apply the armament to a section of their body, over their entire body, and even imbue it onto their weapons. A coating of Busoshoku will cause the coated area to turn a shiny black, and a particularly thick and powerful coating will have a flame-like pattern along its edge. An advanced level of Busoshoku allows the user to emit the armament a short distance without a medium. A higher grade of advanced Busoshoku allows the user to make the emitted armament flow into a target's body and destroy it from the inside out. Luffy can use all the advanced haki of this as well.</p>
            <h1>Conquers Haki</h1>
            <p>Conqueror's Haki, which grants the user the ability to unleash their own willpower to overpower the will of others. This results in victims being mentally overwhelmed by the user, with particularly weak-willed foes instantly losing consciousness. It can also apply pressure onto objects and damage them, a clash between two particularly strong Haoshoku users is capable of "splitting the heavens". Unlike the other types of Haki which can be learned by anyone, Haoshoku is rare ability that only one in several million people are born with the ability to use. An advanced level of Haoshoku allows the user to infuse their conquering spirit into their weapons and physical attacks, greatly augmenting their power. Only a small handful of the most powerful conquers haki users are able to achieve this. Another advanced level of Haoshoku allows for the ability to manipulate one's aura or presence, which negates an opponent's ability to sense the user with observation Haki.</p>
        </div>
        <hr>
        <footer>
            <div class="usedl">
                <h5>USEFUL LINKS</h5>
                <ul>
                    <li>About</li>
                    <li>More</li>
                    <li>Services</li>
                </ul>
            </div>
            <div class="middle">
                <H5>NEWSLETTER</H5>
                    <form class="mai">
                        <input type="email" placeholder="Your Email Address">
                        <button>SUBSCRIBE NOW</button>
                    </form>
            </div>
            <div class="soc">
                <h5>SOCIAL MEDIA</h5>
                <ul>
                    <li><i class="fa-brands fa-instagram"></i></li>
                    <li><i class="fa-brands fa-twitter"></i></li>
                    <li><i class="fa-brands fa-tiktok"></i></li>
                    <li><i class="fa-brands fa-whatsapp"></i></li>
                </ul>
            </div>
        </footer>
    </div>
</body>
</html>