-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
155 lines (141 loc) · 7.86 KB
/
index.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
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ArtWork</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
<!--navigation starts-->
<nav>
<ul class="logo">
<li>Logo</li>
<span class="icons">
<li class="home"><i class="fa-solid fa-house"></i></li>
<li class="search"><i class="fa-solid fa-magnifying-glass"></i></li>
<li class="location"><i class="fa-solid fa-location-dot"></i></li>
<li class="download"><i class="fa-solid fa-download"></i></li>
<li class="phone"><i class="fa-solid fa-phone"></i></li>
</span>
</ul>
<div class="menu-bar">
<span></span>
<span></span>
<span></span>
</div>
</nav>
<!--navigation ends-->
<!--header starts-->
<header>
<div class="main-heading">
<h1>What is called Art ?</h1>
</div>
<div class="sub-heading">
<p>Art is a term that encompasses a wide range of creative expressions and manifestations and is often subjective. In its most general sense, art <p class="highlight">refers to the products of human creativity and imagination that are intended to evoke emotional responses, stimulate thoughts, or communicate ideas.</p><p>Art can take various forms and exist in diverse mediums, including visual arts such as painting, sculpture, and photography, performing arts like dance, theater, and music, literary arts such as poetry and prose, and more.
The subjective nature of art means that its interpretation and value can vary from person to person. What one person considers art might not resonate with another, and different cultures and historical periods have produced vastly different forms of artistic expression.
</p>
</div>
<img src="https://images.unsplash.com/photo-1543502708-eb29f9b35f17?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img1" class="img1"/>
</header>
<!--header ends-->
<!--main starts-->
<div class="title-1">
<h1>Art Works</h1>
</div>
<main>
<img src="https://images.unsplash.com/photo-1678188621209-08d076d6ccc9?q=80&w=1799&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img2" class="img2"/>
<img src="https://images.unsplash.com/photo-1439778615639-28529f7628bc?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img3" class="img2"/>
<img src="https://images.unsplash.com/photo-1515202913167-d9a698095ebf?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img4" class="img2"/>
<img src="https://images.unsplash.com/photo-1579783902614-a3fb3927b6a5?q=80&w=1945&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img5" class="img2"/>
<img src="https://images.unsplash.com/photo-1561214115-f2f134cc4912?q=80&w=1909&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img6" class="img2"/>
<img src="https://images.unsplash.com/photo-1579783928621-7a13d66a62d1?q=80&w=1890&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img7" class="img2"/>
</main>
<section class="main-section">
<div class="main-hding">
<h1>Seven types of Art</h1>
<p>Today's seven art forms are-</p>
</div>
<div class="sub-hding">
<ul>
<li>Painting</li>
<li>Sculpture</li>
<li>Literature</li>
<li>Architecture</li>
<li>Theatre</li>
<li>Film</li>
<li>Music</li>
</ul>
</div>
</div>
</section>
<section class="image-container">
<div class="list">
<div class="items">
<h1>Painting</h1>
<img src="https://images.unsplash.com/photo-1579965342575-16428a7c8881?q=80&w=1962&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img8"/>
</div>
<div class="items">
<h1>Sculpture</h1>
<img src="https://images.unsplash.com/photo-1601887389937-0b02c26b602c?q=80&w=1854&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img9"/>
</div>
<div class="items">
<h1>Literature</h1>
<img src="https://images.unsplash.com/photo-1595123550384-b81222e23cf9?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img10"/>
</div>
<div class="items">
<h1>Architecture</h1>
<img src="https://plus.unsplash.com/premium_photo-1671734046045-6ffc442d068b?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img11"/>
</div>
<div class="items">
<h1>Theatre</h1>
<img src="https://images.unsplash.com/photo-1615414015111-8d98cb65677e?q=80&w=1965&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img12"/>
</div>
<div class="items">
<h1>Film</h1>
<img src="https://images.unsplash.com/photo-1529798856831-427dfd0a1ab1?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img13"/>
</div>
<div class="items">
<h1>Music</h1>
<img src="https://images.unsplash.com/photo-1484876065684-b683cf17d276?q=80&w=1887&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D" alt="img14"/>
</div>
</div>
</div>
</section>
<footer>
<section class="footershade">
<div class="logoo">
<h1>Logo</h1>
</div>
<div class="parah">
<p>Hey there! I've got some exciting news to share. This awesome demo project was created by <span>Jishnu Mohan</span>, a talented software developer. He's done a fantastic job putting it all together, and I can't wait for you to check it out!</p>
</div>
</section>
<div class="difpart">
<div class="s1">
<h1>Contact</h1>
<p><a href="https://www.instagram.com/alien_mindd/"><i class="fa-brands fa-instagram"></i> instagram</a></p>
<p><a href="https://github.com/Jishnumo"><i class="fa-brands fa-github"></i> github</a></p>
<p><a href="www.linkedin.com/in/jishnu-mohan-b5837a227"><i class="fa-brands fa-linkedin"></i> linkdin</a></p>
</div>
<div class="s2">
<h1>About</h1>
<p>News & Blog</p>
<p>Features</p>
<p>About Us</p>
</div>
<div class="s3">
<h1>Company</h1>
<p>How We Work?</p>
<p>Capital</p>
<p>Security</p>
</div>
</div>
</footer>
<aside>
<p>Copyright @ 2023 Jishnu Webdev | Provided by
<span>Jishnu Webdev</span></p>
</aside>
</body>
</html>