Sie sind auf Seite 1von 12

COMMONERS’ HOME FOR EDUCATION

Birtamode-5,Jhapa

Lab report of computer practical

HyperText Markup Language(HTML)

Topic:Computer Manufacturing company

Under the guidance of Mr.Chitrangad Timsina

Submitted By: Submitted TO:

Dipen Bhattarai Nepal Examination Board

Reg. No:

…………… …………………….

Internal External

1
ACKNOWLEDGE
Every organized report requires a lot of hard work and seeks a lot
of helping hands. Upto the completionof this project report, It was
not so far from this rule.

First of all,I would like to thank my subject teacher


Mr.Chitrangad Timsina for his Proper guidance and moderation
during my classes. Plus,I owe thank to my friends for their
continous support and help on the complication of my project work.
As well as with the help of internet I’m able to search about this
project and through internet I’m able to design this webpage.

At last I would like to remember and thank every


individual who helped me to complete my project
successfully.Love you all.

Regards,

Dipen Bhattarai

2
CONTENTS

S.N Name Page


1 PICTURE OF LOGO AND 4
BACKGROUND IMAGE
2 INPUT-LOG IN 5
3 OUTPUT-LOG IN 5
4 INPUT-WEBSITE 6
5 OUTPUT-WEBSITE 6
6 INPUT-HOME 7
7 OUTPUT-HOME 7
8 INPUT-VACANCY 8

9 OUTPUT-VACANCY 9
10 INPUT-CONTACT US 10
11 OUTPUT-CONTACT US 10
12 INPUT-ABOUT US 11
13 OUTPUT-ABOUT US 11
14 CONCLUSION 12

Images used

3
LOGO OF COMPANY

BACKGROUND IMAGE OF WEBSITE

4
INPUT
<html> <head><title>Log in</title>
<style> .loginbox{
width: 320px; height: 420px; background:#000; color: #fff;
top: 50%; left: 50%; position:absolute;
transform: translate(-50%,-50%);
box-sizing: border-box; padding: 70px 30px; }
h1{ margin: 0; padding: 0 0 20px; text-align: center;
font-size: 22px;
}
.loginbox p{ margin: 0; padding: 0; font-weight: bold;
} .loginbox input{
width: 100%; margin-bottom: 20px; }
.loginbox input[type=”text”],input[ type=”password”]
color: #fff; font-size: 16px;
.loginbox input[type=”subm{ border: none; outline: none; height: 40px;
background: #fb2525;C color: #fff; font-size: 18px; } .loginbox
input[type=”submit” ]
:hover
{ cursor: pointer; background: #ffc107; color: #000; }
.loginbox a{ text-decoration:none; font-size: 12px;
line-height: 20px; color: darkgrey;
}
.loginbox a:hover
{ color: #ffc107;
} </style> </head> <body> <form name= "Dipen"method="post"
action="web.html"> <div class=”loginbox”> <h1> LOGIN HERE </h1>
<form name= “log in”method=”post” action=”mainpage.html> <p> username</p>
<input type=”text” name=””placeholder=”enter your username”> <p> password</p>
<input type=”password” name=””placeholder=”enter your password”>
<input type=”submit” name=””value=”login”> </form> </div> </body</html>
OUTPUT

INPUT

<!DOCTYPE html>

5
<html>
<head> <style>
*{ margin: 0px; padding:0px; box-sizing: border-box; }body{ font-size:20px; overflow-x:hidden;
color:white; }
header{ background-image: url(‘css/286.jpg’);
background-size:cover; background-repeat: no-repeat; height: 100vh; }.clearfix:after{ content:”.”;
visibility:hidden; display:block;
height:0px; clear:both;}
.row{max-width:1180px; margin: 0 auto; }
.logo{height:120px; width:auto; float:left; margin-top:20px; }
.main-nav{ float:right; margin-top:60px; }
.main-nav li{ display: inline-block; list style:none; margin-left:40px; }
.main-nav li a{ padding:3px 0; color: red; text-decoration:none;text-transform:uppercase;
font-size:90%; font-weight:100; }
.main-content-header{ width:1180px; position: absolute; top:35%; left:50%;
transform:translate(-10%,-10%); border:0px solid red; }
h4{ color:#001gg; font-size: 90%; word-spacing:5px; letter-spacing:0.5px margin-bottom:20px; text-
transform:uppercase;
font-weight:lighter; }
.btn{
display: inline-block;
padding:10px 30px; font-weight:lighter; text-decoration:none; text-transform:uppercase; border-
radius:200px;transition:background-color 0.2s, border 0.2s, color 0.2s;
}
.btn-full{background-color: transparent; color:gold;
margin-right:15px;}
.btn-full:hover{background-color: green;}
.main-nav li a:hover{
border-bottom:2px solid red;}</style> <title>DB COMPUTER MANUFACTURING COMPANY</title>
</head <body> <header> <nav> <div class=”row clearfix”><img src=”css/2.png”height=”90” class=”logo”>
<ul class=”main-nav animated slideInDown”>
<li><a href=”a.html”>Home</a></li> <li><a href=”az.html”>vacancy</a></li> <li><a href=”contact.html”>Contact Us</a></li>
<li><a href=”about.html”>about</a></li> </ul></div>
</nav>
<div class=”main-content-header”>
<h4> WELCOME TO OFFICIAL WEBSITE OF <span class=”dipen”><br> DB COMPUTER MANUFACTURING<br>
COMPANY</span>.<br> NO COMPUTER NO WORLD.</h4>
<a href=”https://www.youtube.com/watch?v=P94CMdI62xQ” class=”btn btn-full”>Watch video</a>
</div></header>

</body> </html>

OUTPUT

6
INPUT
<html><head><title>Company Overviews</title>

<body bgcolor="blue" text="white"><h1>DB COMPANY MAKES


<BR>POSSIBLE THE MOST AMAZING<BR>EXPIRENCE <BR>WITH
FUTURE<BR></h1>

You may have know our company espacially for gaming PC.But, we do much
more.We invents the pc to fulfill the gap between present and future
generation.<p>

In our latest advannce is on memory and programmable solution.And proise of


5G connectivity.We are disruping and solving the global challanges.we are
creating <br>

value for society and also for business purposes.</body>

</head>

</html>

OUTPUT

INPUT
<html> <head> <title> vacancy

7
</title> </head> <body align="center"> <h1> OPENED</h1><br> <h3><a
href="vacancy.html">COMPUTER ENGINEER</h3></a><br>
Click above to continue for applying for post.<br>
Hurry up! limited seats are only available.<br> NO VACSNCIES FOR OTHER POST IS AVAILABLE
NOW.
WE WILL NOTIFY YOU IF ANY POST IS REQUIRED </body> </html>
NEXT
<!DOCTYPE html>
<html> <head> <title>Applicant Form</title>
</head> <body bgcolor="black"text="white"><tr>
<td colspan="2"><center><font color="white"><u><b><i><h1>APPLICANT
FORM</center></font></u></b></i></h1></td> </tr>
<tr> <td>Name;</td> <td><input type="text"size="50"></td>
</tr> <br> <tr> <td> Permanent Address;</td> <td><input
type="text"size="50"></td>
</tr> <br> <tr> <td>Temporary Address;</td>
<td><input type="text"size="50"></td>
</tr><br> <tr>
<td>Resisdent Number;</td> <td><input type="text"size="50"></td> </tr><br>
<tr>
<td>Mobile Number;</td> <td><input type="text"size="50"></td>
</tr><br> <tr> <td>education;</td> <td><input
type="text"size="50"></td>
</tr><br> <tr> <td>Experience;</td>
<td><input type="text"size="50"></td> </tr><br> <tr> <td>Sex;</td>
<td><input type="radio"size="15"name="gender">male <input
type="radio"name="gender">female
<input type="radio"name="gender">other</td><br> Education Accured position:-
<input type="checkbox">Distinction<input type="checkbox">1st division<input
type="checkbox">2nd Division<input type="checkbox">Others<br>
country:-<select name="country"> <option >Nepal</option>
<option>India</option> <option>China</option><option>USA</option>
<option>Russia</option><option>Others</option>
</select><br> <input type="submit"value="OK">
<input type="reset"value="reset">
<h4><U>Its also compolsory for the applicant to send their send their CV and Expirence
certificate with their mark sheet of Computer engineering with this form</h4> </body>
</html>

8
9
INPUT

<html>

<head>

<title>contact DB company</title>

<body><h3>contact corporate on mailing address<br>

<u>world wide contact information<br>

</u>DBcomputermanufacturer@gmail.com<br>

</h3> FOR nepal contact here.....<br>980000000000 or,0155548686<br>

For software support or for any other issues contact costumer service center <br>

Phone no.=900054

</body>

</head></html>

output

10
INPUT

<html>

<head>

<title >About</title>

<body bgcolor="black" text="white">

<i><h4>

<u>Original equipment Manufacturer</u></h4><br>

DB computer manufacturer provides the IBM compatiable computer as well IBM


computer.Its providdes different versions of software on computer.<br>

This computer manufacturer company provides user friendly computer programmes


as our main goal is to satisfy our costumer.<p>

If you are expirencing issues with or have question about your computer then
the system manufacturer is main source of support.check the official website of our
<br>company for

updates if available or by clicking on "settings".<p>

we provides both qualitive with cheap price computer. </i>

</body> </head> </html>

OUTPUT

11
CONCLUSION
It was a wonderful and learning experience for me while working on
this project.This project took me through the various phases of project
development and gave me real insight into the world of software
engineering.The joy of working and thrill involved while tackling the various
problems and challenges gave me a feel of developers industry.

It was due to this project I came to know how professional software are
designed. I enjoyed each and every bit of work I had put into this project.The
project is further expandable. Atlast, the main objective of making this project
is to make the readers known about the subject of this project

”Computer manufacturing company” .I hope the


project can give or provide main thing about a computer manufacturing
company dedicated to uplift computer software through this project.

Thank you!!

12

Das könnte Ihnen auch gefallen