0% found this document useful (0 votes)
45 views

HTML

HTML stands for Hypertext Markup Language and is used to build websites. It uses tags to define text formatting and structure. Some key points covered are that HTML is easy to learn and platform independent, and can be used to add images, videos, audio and hyperlinks to web pages. The basic structure of an HTML document is also explained.

Uploaded by

saurenstha0
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
45 views

HTML

HTML stands for Hypertext Markup Language and is used to build websites. It uses tags to define text formatting and structure. Some key points covered are that HTML is easy to learn and platform independent, and can be used to add images, videos, audio and hyperlinks to web pages. The basic structure of an HTML document is also explained.

Uploaded by

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

Introduction:

HTML stands for Hypertext Markup Language. It is the standard markup language used to
create web pages. HTML is a combination of Hypertext and Markup language. Hypertext
defines the link between web pages. A markup language is used to define the text document
within the tag to define the structure of web pages.

This language is used to annotate (make notes for the computer) text so that a machine can
understand it and manipulate text accordingly. Most markup languages (e.g. HTML) are human-
readable. The language uses tags to define what manipulation has to be done on the text.

Advantages of HTML:

1. HTML is used to build websites.


2. It is supported by all browsers.
3. It can be integrated with other languages like CSS, JavaScript, etc.

Disadvantages of HTML:

1. HTML can only create static web pages. For dynamic web pages, other languages have
to be used.
2. A large amount of code has to be written to create a simple web page.
3. The security feature is not good.

Features of HTML

1. It is easy to learn and easy to use.


2. It is platform-independent.
3. Images, videos, and audio can be added to a web page.
4. Hypertext can be added to the text.
5. It is a markup language.

1
Basic structure of html:
<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<meta name="viewport"

content="width=device-width, initial-scale=1.0">

<!--The above meta characteristics make a website

compatible with different devices. -->

<title>Demo Web Page</title>

</head>

<body>

<h1>GeeksforGeeks</h1>

<p>A computer science portal for geeks</p>

</body>

</html>

2
<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Academy Website</title>

<style>

.main{

width : 50%;

margin: auto;

border: 1px solid rgb(0, 0, 0) ;

padding: 10px;

html, body {

margin: 0;

padding: 0;

*{

box-sizing: border-box;

html,* { font-family: 'Inter'; }

3
body { background-color:whitesmoke; line-height:1.6; color: #0f0e0e;}

</style>

</head>

<body>

<!-- Header section -->

<header>

<h1>welcome to saugat's website</h1>

<nav class="navbar navbar-expand-lg navbar-light bg-light">

<div class="container-fluid">

<form class="d-flex">

<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">

<button class="btn btn-outline-success" type="submit">Search</button>

</form>

<div class="collapse navbar-collapse" id="navbarSupportedContent">

<ul class="navbar-nav me-auto mb-2 mb-lg-0">

<li class="nav-item">

<a class="navbar-brand" href="./orderedandunodered,.html">list </a>

</li>

<li class="nav-item">

<a class="nav-link active" aria-current="page"


href="./registrationform.html">registrationform</a>

</li>

4
<li class="nav-item">

<a class="nav-link" href="contactu.html">contact</a>

</li>

<li class="nav-item dropdown">

<a class="nav-link dropdown-toggle" href="./table6.html ">table</a>

<ul class="dropdown-menu" aria-labelledby="navbarDropdown">

</ul>

</li>

</ul>

</div>

</div>

</nav>

</header>

</html>

5
6
Code of orderedlistandunorderedlist.html:

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Document</title>

<style>

body{

width: 50%;

margin: auto;

border: 1px solid rgb(0, 0, 0);

background:#e7e9e8;

</style>

</head>

<body>

<h1>list</h1>

<p>name of football players</p>

<ol>

<li>messi</li>

<li>ronaldo</li>

<li>neymar</li>

7
</ol>

<ul>

<p>their fav car </p>

<li>g-wagon</li>

<li>bugati</li>

<li>bmw</li>

</ul>

<h2>current playing team</h2>

<dl>

<dd>inter miami</dd>

<dd>AL-nassar</dd>

<dd>al-hilal</dd>

</dl>

</body>

</html>

Image of orderedandunorderedlist.html:
8
Code of registrationform.html:

9
<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Document</title>

<style>

h1{

text-align: center;

.child2{

width: 50%;

margin: auto;

border: 1px solid rgb(0, 0, 0);

background:#eeff00;

.parent {

border: 1px solid black;

margin: 1rem;

padding: 2rem;

text-size-adjust: 6px;

10
</style>

</head>

<body>

<h1 style="color: slategrey;text-justify: auto;">Registration form</h1>

<div class="child2">

<label> Firstname </label>

<input type="text" name="firstname" size="15"/> <br> <br>

<label> Middlename: </label>

<input type="text" name="middlename" size="15"/> <br> <br>

<label> Lastname: </label>

<input type="text" name="lastname" size="15"/> <br> <br>

<br>

<br>

<label>

Gender :

</label><br>

<input type="checkbox" name="male"/> Male <br>

<input type="checkbox" name="female"/> Female <br>

<input type="checkbox" name="other"/> Other

<br>

<br>

<label>

11
Phone :

</label>

<input type="text" name="country code" value="+977" size="2"/>

<input type="text" name="phone" size="10"/> <br> <br>

<br>

<label for="Address">Address</label>

<input type="text" name="address " size="15"/> <br> <br>

<br> <br>

Email:

<input type="email" id="email" name="email"/> <br>

<br> <br>

Password:

<input type="Password" id="pass" name="pass"> <br>

<br> <br>

Re-type password:

<input type="Password" id="repass" name="repass"> <br> <br>

<input type="button" value="Submit"/>

</form>

<script src="./bootstrap-5.3.0-dist/js/bootstrap.bundle.js"></script>

</body>

</html>

12
Image of registrationform.html:

Code for table6.html:

13
<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Document</title>

<style>

.main{

width : 50%;

margin: auto;

border: 1px solid rgb(0, 0, 0) ;

padding: 10px;

table,tr,td,th{

border:1px solid rgb(0, 0, 0);

border-collapse: collapse;

table{

width: 50%;

margin: auto;

td{

padding: 5px;

14
}

</style>

</head>

<body>

<div class="main">

<table style="width:100%">

<caption>list of students</caption>

<tr>

<th rowspan="2" width="20%">s.n</th>

<th colspan="2 "weidth=40%>Name </th>

<tr>

<th>first name</th>

<th>last name </th>

<tr>

<tr>

<td rowspan="2">1.</td>

<td>saugat</td>

<td>pandey</td>

</tr>

15
<tr>

<td>sauren</td>

<td>shrestha</td>

</tr>

<tr>

<tr>

<tr>

<td rowspan="2">2.</td>

<td>naveen</td>

<td>panday</td>

</tr>

<tr>

<td>parthak</td>

<td>kandel</td>

</tr>

</table>

</div>

</body>

</html>

16
Image of table6.html:

17

You might also like