Scribd
Upload
103 views4 pages

Minor-Project HTML

The document is an HTML file that presents information about various historical places in India through images and text within a three-column flexible container layout. It includes sections on the Taj Mahal, Hawa Mahal, Gwalior Fort and other landmarks. Styling is applied using CSS for colors, backgrounds, positioning of header and footer bars, and responsive design.

Uploaded by

Shubham Thorbole
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
103 views4 pages

Minor-Project HTML

The document is an HTML file that presents information about various historical places in India through images and text within a three-column flexible container layout. It includes sections on the Taj Mahal, Hawa Mahal, Gwalior Fort and other landmarks. Styling is applied using CSS for colors, backgrounds, positioning of header and footer bars, and responsive design.

Uploaded by

Shubham Thorbole
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

10/15/22, 4:53 PM Minor-Project.

html

1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4    <meta charset="UTF-8">
5    <meta http-equiv="X-UA-Compatible" content="IE=edge">
6    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7    <title>MINOR-SEPTEMBER</title>
8    <link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet">
9    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-
[email protected]/font/bootstrap-icons.css">
10    <style>
11        body{
12            background-image: linear-gradient(90deg,#51c7df,#f20f62,#e3f20b);
13            background-size: cover;
14            background-attachment: fixed;
15            background-repeat: no-repeat;
16            padding:80px;
17       }
18        #header{
19            width:100%;
20            top:0px;
21            left:0px;
22            background-image:linear-gradient(90deg,#FF8C00,#8B4513,#6F4E37);
23            color:aqua;
24            text-align:center;
25            position:fixed;
26       }
27        #footer{
28            width:100%;
29            bottom:0px;
30            left:0px;
31            background-image:linear-gradient(90deg,#ffc800,#13358b,#6f3737);
32            color:aqua;
33            text-align:center;
34            position:fixed;
35            font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-
serif;
36            font-size: 20px;
37       }
38        .container{
39            width:100%;
40            display:flex;
41            background:darkviolet;
42            padding: 10px;
43            flex-wrap: wrap;
44       }
45        .icontainerl{
46            flex:1;
47            background:lightgreen;
48            font-family: 'Roboto',sans-serif;
49            margin:15px;
50       }
51        .icontainerc{
52            flex:1;
53            background:lightcoral;
54            margin:15px;
55       }

localhost:4649/?mode=htmlmixed 1/4
10/15/22, 4:53 PM Minor-Project.html

56        .icontainerr{
57            flex:1;
58            background:cornsilk;
59            margin:15px;
60       }
61
62        @media (max-width: 768px){
63            .container{
64                flex-direction: row-reverse;
65           }
66       }
67    </style>
68 </head>
69 <body>
70   <div id="header"><h1 align="center">Historical Places in India</h1></div>
71
72
73   <div class="container">
74    <div class="icontainerl" align="center"><img class="dasimages"
src="https://upload.wikimedia.org/wikipedia/commons/6/67/Taj_Mahal_in_India_-
_Kristian_Bertel.jpg" width="300px" height="200px"><br><br>
75        <a href="https://en.wikipedia.org/wiki/Taj_Mahal" class="btn btn-
primary">Taj Mahal</a><br><br>
76       It was built by Mughal Emperor Shah Jahan in memory of his wife Mumtaz Mahal
with construction starting in 1632 AD and completed in 1648 AD, with the mosque, the
guest house and the main gateway on the south, the outer courtyard and its cloisters
were added subsequently and completed in 1653 AD.
77    </div>
78    <div class="icontainerc" align="center"><img
src="https://upload.wikimedia.org/wikipedia/commons/b/ba/Hawa_Mahal_east_facade_%281
4-07-2022%29.jpg" width="300px" height="200px"><br><br>
79        <a href="https://en.wikipedia.org/wiki/Hawa_Mahal" class="btn btn-
success">Hawa Mahal</a><br><br>
80       The five-storey building looks like a honeycomb of a beehive and it is
always windy inside, owing to the numerous windows and jharokhas. This amazing
ventilation that the palace enjoys is the reason why it was named as the Hawa Mahal,
which literally translates into the “Palace of the Winds”.
81    </div>
82    <div class="icontainerr" align="center"><img
src="https://upload.wikimedia.org/wikipedia/commons/1/15/Gwalior_1.JPG"
width="300px" height="200px"><br><br>
83        <a href="https://en.wikipedia.org/wiki/Gwalior_Fort" class="btn btn-
warning">Gwalior Fort</a><br><br>
84       According to a local legend, the fort was built by a local king named Suraj
Sen in 3 CE. He was cured of leprosy, when a sage named Gwalipa offered him the
water from a sacred pond, which now lies within the fort. The grateful king
constructed a fort, and named it after the sage.
85    </div>
86    </div>
87
88
89   <div class="container">
90    <div class="icontainerl" align="center"><img
src="https://upload.wikimedia.org/wikipedia/commons/9/94/The_Golden_Temple_of_Amrith
sar_7.jpg" width="300px" height="200px"><br><br>
91        <a href="https://en.wikipedia.org/wiki/Golden_Temple" class="btn btn-
primary">Golden Temple</a><br><br>
92       The Golden temple is located in the holy city of the Sikhs, Amritsar. The
Golden temple is famous for its full golden dome, it is one of the most sacred

localhost:4649/?mode=htmlmixed 2/4
10/15/22, 4:53 PM Minor-Project.html

pilgrim spots for Sikhs. The Mandir is built on a 67-ft square of marble and is a
two storied structure.
93    </div>
94    <div class="icontainerc" align="center"><img
src="https://upload.wikimedia.org/wikipedia/commons/0/09/India_Gate_in_New_Delhi_03-
2016.jpg" width="300px" height="200px"><br><br>
95        <a href="https://en.wikipedia.org/wiki/India_Gate" class="btn btn-
success">India Gate</a><br><br>
96       India Gate, official name Delhi Memorial, originally called All-India War
Memorial, monumental sandstone arch in New Delhi, dedicated to the troops of British
India who died in wars fought between 1914 and 1919
97    </div>
98    <div class="icontainerr" align="center"><img
src="https://upload.wikimedia.org/wikipedia/commons/f/fb/20191219_Fort_Amber%2C_Amer
%2C_Jaipur_0955_9481.jpg" width="300px" height="200px"><br><br>
99        <a href="https://en.wikipedia.org/wiki/Amber_Fort" class="btn btn-
warning">Amer Fort</a><br><br>
100       Located high on a hill, it is the principal tourist attraction in Jaipur.
Amer Fort is known for its artistic style elements. With its large ramparts and
series of gates and cobbled paths, the fort overlooks Maota Lake, which is the main
source of water for the Amer Palace.
101    </div>
102    </div>
103
104
105   <div class="container">
106    <div class="icontainerl" align="center"><img
src="https://upload.wikimedia.org/wikipedia/commons/d/d1/Charminar-
Pride_of_Hyderabad.jpg" width="300px" height="200px"><br><br>
107        <a href="https://en.wikipedia.org/wiki/Charminar" class="btn btn-
primary">Charminar</a><br><br>
108       The Charminar is a monument and mosque in Hyderabad, India. The structure
was built in 1591 AD. It is the most famous building of Hyderabad and also one of
the most famous buildings in India. It was built by Muhammad Quli Qutb Shahi to
celebrate the end of a deadly plague.
109    </div>
110    <div class="icontainerc" align="center"><img
src="https://upload.wikimedia.org/wikipedia/commons/4/4b/Hampi_virupaksha_temple.jpg
" width="300px" height="200px"><br><br>
111        <a href="https://en.wikipedia.org/wiki/Hampi" class="btn btn-
success">Hampi</a><br><br>
112       Hampi was the capital of the Vijayanagara Empire in the 14th century. It was
a fortified city. Chronicles left by Persian and European travellers, particularly
the Portuguese, say that Hampi was a prosperous, wealthy and grand city near the
Tungabhadra River, with numerous temples, farms and trading markets.
113    </div>
114    <div class="icontainerr" align="center"><img
src="https://upload.wikimedia.org/wikipedia/commons/0/0c/Gol_Gumbaj2.JPG"
width="300px" height="200px"><br><br>
115        <a href="https://en.wikipedia.org/wiki/Gol_Gumbaz" class="btn btn-
warning">Gol Gumbaz</a><br><br>
116       Gol Gumbaz is the most famous monument in Vijayapura. It is the tomb of
Mohammed Adil Shah (ruled 1627–1657). It is the second largest dome ever built, next
in size only to St Peter's Basilica in Rome. A particular attraction in this
monument is the central chamber, where every sound is echoed seven times.
117    </div>
118   </div>
119
120

localhost:4649/?mode=htmlmixed 3/4
10/15/22, 4:53 PM Minor-Project.html

121   <div id="footer" align="center"><h4 align="center">Designed and Developed by


Shubham</h4></div>
122 </body>
123 </html>

localhost:4649/?mode=htmlmixed 4/4

You might also like