-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathdum.html
72 lines (58 loc) · 2.45 KB
/
dum.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
<!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">
<link rel="stylesheet" href="css/output.css">
<title>Ayush Acharya ko website </title>
</head>
<body>
<nav class=" relative container mx-auto p-6">
<!--nav -bar relative use gareko chai paxi hamburger menu rakhna lai ho-->
<!-- i am still learning-->
<!-- flex container halni -->
<!-- -->
<div class=" flex items-center justify-between">
<!-- logo rakhne re -->
<div class="pt-2">
<img class="w-24" src="./logo.png" alt="logo" srcset="">
</div>
<!-- items in nav-bar -->
<!-- <div class="hidden md:flex space-x-6"> -->
<div class="hidden space-x-6 md:flex">
<a class="hover:underline" href="#">home</a>
<a class="hover:underline" href="#">menu</a>
<a class="hover:underline" href="#">about</a>
<a class="hover:underline" href="#">info</a>
<a class="hover:underline" href="#">feedback</a>
</div>
<a href="" class=" hidden md:block p-3 px-6 pt-2 text-white bg-blue-600 rounded-full baseline hover:bg-blue-900">let's begin</a>
</div>
</nav>
<!-- mainn section -->
<section id="mainn">
<!-- Flex Container -->
<div class="container flex flex-col-reverse items-center px-6 mx-auto mt-10 space-y-0 md:space-y-0 md:flex-row" >
<!-- Left item -->
<div class="flex flex-col mb-32 space-y-12 md:w-1/2">
<h1
class="max-w-md text-4xl font-bold text-center md:text-5xl md:text-left">
Hello ! I am <p class="text-blue-600">Ayush Acharya</p> welcome to my site
</h1>
<p class="max-w-sm text-center text-darkGrayishBlue md:text-left">
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. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
pariatu
</p>
</div>
<div class="md:w-1/2">
<img src="./side.png" alt="" />
</div>
</div>
</section>
</body>
</html>