In this article, you will learn how to make a film collection website using HTML and CSS. This is a part-3 of film collection website. Visit other parts of the film website click the link below.
aboutus.html
<html>
<head>
<title>FilmDekho-about us</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="header">
<a href="index.html"><div class="logo_big"></div></a>
<div class="name_big">FilmDekho</div>
</div>
<div class="container">
<div id="sub_con">
<h1>About Us:</h1>
<h2>Hi,
</div>
</h2>
</div>
</div>
<div class="footer">
<div class="copy_right">©FilmDekho2017</div>
<a href="aboutus.html"><div class="about-us">|About us|</div></a>
<a href="contactus.html"><div class="contact-us">|Contact us|</div></a>
</body>
</html>
contactus.html
<html>
<head>
<title>FilmDekho-contactus</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="header">
<a href="index.html"><div class="logo_big"></div></a>
<div class="name_big">FilmDekho</div>
</div>
<div class="container">
<div id="sub_con">
<h1>If Any Requirement Contact Us:</h1>
<h2>E-mail:codetextpro.com@gmail.com</h2>
</div>
</div>
<div class="footer">
<div class="copy_right">©FilmDekho2017</div>
<a href="aboutus.html"><div class="about-us">|About us|</div></a>
<a href="contactus.html"><div class="contact-us">|Contact us|</div></a>
</div>
</body>
</html>
downloadpage.html
<html>
<body>
Please wait you file is being processed to be downloaded</br>else <a href>Click Here</a>
</body>
</html>
style.css
/*style page*/
/*body{background-image: url("img/bg1.jpg"); }*/
.header{position:absolute; height:10%; width:80%; top:0px; left:10%;border-bottom-left-radius:20px;border-bottom-right-radius:20px;color:#000; background-image: url("img/hd1.jpg");}
.logo_big{position:absolute; height:50px; width:50px; top:5%; left:5%; border-radius: 50%;background-image: url("img/logo.png");}
.name_big{position:absolute; height:60%; width:30%; top:15%; left:10%; border:2px solid #fcf; color:#fff;}
.container{position:absolute; height:80%; width:80%; top:10%; left:10%; background-color:#00555555;}
#sub_con{position:absolute; height:90%; width:80%; top:5%; left:10%;overflow-y:scroll;float:left; }
.btn{position:absolute; height:25%; width:50%; left:25%; border-radius:10px; color:#fff;}
#tolly{top:6%;background-image: url("img/tolly.jpg"); color:#000;}
#bolly{top:37%;background-image: url("img/bolly.jpg");}
#holly{top:68%;background-image: url("img/holly.jpg");}
.main_table{position:absolute;height:98%;width:98%;top:1%;left:1%; background-color:#00fff59b;}
.tr_cl{height:20px;width:100%;overflow:none;}
.td_cl{position:absolute;height:20px; overflow:none;}
#fname{width:70%;}
#td_cl1{left:0px; width:4%;text-align:center;}
#td_cl2{left:10%;width:74%;text-align:left;}
#td_cl3{left:66%;width:22%;text-align:center;}
#table_head{}
.footer{position:absolute; height:10%; width:80%; top:90%; left:10%; border-top-left-radius:20px;border-top-right-radius:20px;color:#000; background-image: url("img/fd1.jpg");}
.copy_right{position:absolute; height:30%; width:15%; top:30%; left:3%; color:#fff;}
.about-us{position:absolute; height:30%; top:30%; left:79%; color:#fff; }
.contact-us{position:absolute; height:30%; top:30%; left:87%; color:#fff; }
0 Comments