-
Notifications
You must be signed in to change notification settings - Fork 0
/
filmGenre.html
134 lines (114 loc) · 3.36 KB
/
filmGenre.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
<!DOCTYPE html>
<html>
<head>
<link href="css/style.css" rel="stylesheet" type="text/css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!..internal css file..>
<style>
* {
box-sizing: border-box;
}
.row {
display: flex;
}
/* Create three equal columns that sits next to each other */
.column {
flex: 33.33%;
padding: 5px;
}
.centerI {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
/*section 1,2 and 3 are for the 3 separate types of films and to have separate columns and separate formats for them*/
section1 {
float: left;
width: 100%;
height: 400px;
background: #ccc;
padding: 20px;
}
section2 {
float: left;
width: 100%;
height: 400px;
background: #f1f1f1;
padding: 20px;
}
section3 {
float: left;
width: 100%;
height: 400px;
background: #ccc;
padding: 20px;
}
#contentH2{
background-image:url(images/films.jpg);
}
h1{
font-size: 250%;
margin-top:-5px;
font-family: cursive;
}
</style>
</head>
<body id="contentH2" >
<div class="headerH1" >
<img id="logoH1" src="images/logopng.png" alt="logo" >
<div id="navigationbar">
<ul>
<li><a href="team.html">Team</a></li>
<li> <a href="gallery.html">Gallery</a></li>
<li> <a href="siteMap.html">Sitemap</a></li>
<li> <a href="quiz.html">Quiz</a></li>
<li> <a href="products.html">Product</a></li>
<li> <a href="home.html">Home</a></li>
</ul>
</div>
</div>
<h1><center>FILM GENRES</center></h1>
<div class="row">
<div class="column" >
<section1>
<img src="images/comedy.jpg" alt="Comedy" style="width:85%" class="centerI">
<h2><center>Comedy Films</center></h2>
<p align="left"> A comedy film is a genre of film in
which the main emphasis is on <b>humor</b>.
These films are designed to make the audience
laugh through amusement and most often work by
<b>exaggerating</b> characteristics for humorous effect.
Films in this style traditionally have a <b>happy ending</b>.
</section1>
</div>
<div class="column">
<section2>
<img src="images/action.jpg" alt="Action" style="width:75%" class="centerI">
<h2><center>Action Films</center></h2>
<p align="left"> Action films are a film genre
where <b>action sequences</b>, such as fighting, stunts,
car chases or explosions, take precedence over
elements like characterization or <b>complex plotting</b>.
The action typically involves individual efforts on
the part of the <b>hero</b>, in contrast with most war films.
</section2>
</div>
<div class="column">
<section3>
<img src="images/horror.jpg" alt="Horror" style="width:85%" class="centerI">
<h2><center>Horror Films</center></h2>
<p align="left">A horror film is a film that seeks to <b>elicit fear </b>
for entertainment purposes.Horror may also overlap with
the <b>fantasy</b>,<b> supernatural fiction</b>, and <b>thriller genres</b>.
Horror films often aim to evoke viewers' nightmares, fears,
revulsions and terror of the unknown.</p>
</section3>
</div>
</div>
<footer ><p>Posted by: P.G.Charani Hasara</p>
<p> <a href="student2Cv.html">
Page is created by Student 2</a></p>
</footer>
</body>
</html>