-
Notifications
You must be signed in to change notification settings - Fork 0
/
district.html
134 lines (134 loc) · 7.79 KB
/
district.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
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
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="style.css">
<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 rel="icon" href="logo.jpg" type="image/icon type">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
</head>
<body>
<nav class="navbar bg-body-tertiary">
<div class="container-fluid">
<a class="navbar-brand" href="#">
<img src="logo.jpg" alt="Logo" width="" height="50" class="d-inline-block align-text-top">
Kerala Tourism
</a>
<ul class="nav justify-content-end">
<li class="nav-item">
<a class="nav-link active" aria-busy="page" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="district.html">District</a>
</li>
<li class="nav-item">
<a class="nav-link" href="login.html">Login</a>
</li>
<li class="nav-item">
<a class="nav-link" href="signup.html">Sign Up</a>
</li>
</ul>
</nav>
<figure class="text-center">
<blockquote class="blockquote">
<p><h2>District</h2></p>
</blockquote>
</figure>
<div class="container">
Kerala, a state located in the southern part of India, is known for its natural beauty and rich culture. Each district has it's own beauty and style.<br>
Here are the districts that is <b>MUST</b> to visit.
</div><br>
<div class="container text-center">
<div class="row row-cols-3">
<div class="alappuzha">
<div class="card" style="width: 18rem;">
<img src="alappuzha.jpg" class="card-img-top" alt="alappuzha">
<div class="card-body">
<h5 class="card-title">Allapuzha</h5>
<p class="card-text">One of the most beautiful and popular districts in Kerala is the district of Alleppey, also known as Alappuzha. This district is located on the southwestern coast of Kerala and is known for its picturesque backwaters, beaches, and network of canals.</p>
<a href="#" class="btn btn-primary">More info</a>
</div>
</div>
</div>
<div class="pathanamthitta">
<div class="card" style="width: 18rem;">
<img src="pathanamthitta.jpg" class="card-img-top" alt="pathanamthitta">
<div class="card-body">
<h5 class="card-title">Pathanamthitta</h5>
<p class="card-text">It is known for its religious significance, natural beauty, and cultural heritage. The district is home to a number of temples, churches, and mosques, making it a popular pilgrimage destination for people of different faiths.</p><br>
<a href="#" class="btn btn-primary">More info</a>
</div>
</div>
</div>
<div class="wayanad">
<div class="card" style="width: 18rem;">
<img src="wayanad.jpg" class="card-img-top" alt="wayanad">
<div class="card-body">
<h5 class="card-title">Wayanad</h5>
<p class="card-text">The district is known for its natural beauty, wildlife sanctuaries, and cultural heritage. Wayanad is located in the Western Ghats, a mountain range that runs along the western coast of India, and is home to several forests, waterfalls, and wildlife sanctuaries.</p>
<a href="#" class="btn btn-primary">More info</a>
</div>
</div>
</div>
</div>
</div>
<br>
<div class="container text-center">
<div class="row row-cols-3">
<div class="idukki">
<div class="card" style="width: 18rem;">
<img src="idukki.avif" class="card-img-top" alt="idukki">
<div class="card-body">
<h5 class="card-title">Idukki</h5>
<p class="card-text"> The district is known for its picturesque beauty, diverse flora and fauna, and rich cultural heritage. It is situated in the Western Ghats, a mountain range that runs parallel to the western coast of India.The district is famous for its natural attractions like hills and mountains.</p>
<a href="#" class="btn btn-primary">More info</a>
</div>
</div>
</div>
<div class="kollam">
<div class="card" style="width: 18rem;">
<img src="kollam.jpg" class="card-img-top" alt="kollam">
<div class="card-body">
<h5 class="card-title">Kollam</h5>
<p class="card-text">The district is known for its natural beauty,historical landmarks,and cultural heritage.It is situated on the banks of the Ashtamudi Lake, which is the second-largest lake in Kerala and is home to several backwater channels.<br><br></p>
<a href="#" class="btn btn-primary">More info</a>
</div>
</div>
</div>
<div class="thrissur">
<div class="card" style="width: 18rem;">
<img src="thrissur.jpg" class="card-img-top" alt="thrissur">
<div class="card-body">
<h5 class="card-title">Thrissur</h5>
<p class="card-text">It is a district located in the central part of the state.The district is known for its rich cultural heritage,vibrant festivals and historical monuments.Thrissur is the fifth largest city in Kerala and is home to several iconic landmarks and attractions.</p>
<a href="#" class="btn btn-primary">More info</a>
</div>
</div>
</div>
</div>
</div><br>
<div class="row">
<div class="col-sm-6 mb-3 mb-sm-0">
<div class="card">
<div class="card-body">
<h5 class="card-title">Tourist Spots</h5>
<p class="card-text">Check out about the tourist spot</p>
<a href="district.html" class="btn btn-primary">Let's Travel</a>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">Sign Up</h5>
<p class="card-text">New User? Sgn up here</p>
<a href="signup.html" class="btn btn-primary">Sign Up</a>
</div>
</div>
</div>
</div>
</body>
</html>