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

Hyper Text Markup Language (6)

HTML Program

Uploaded by

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

Hyper Text Markup Language (6)

HTML Program

Uploaded by

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

Building a Scientific

Calculator Web Application

Name : Shruti Guleria


Reg No:
Roll No:
Submitted to: Prof. Nishant Sharma
Hyper Text Markup Language (HTML)
1. Introduction
Hypertext Markup Language (HTML) is a markup language for creating a webpage.
Webpages are usually viewed in a web browser. They can include writing. Links, Pictures,
and even sound and video. HTML is used to mark and describe each of these kinds of
content so the browser can display them correctly. HTML can also be used to add meta
information to a webpage, e.g. the name of the person who created the page. Cascading
Style Sheets (CSS) is used to style HTML elements while JavaScript is used to manipulate
HTML elements and CSS Styles.
2. HTML History
The first version of HTML was written by TIM Berners-Lee in 1993. Since then, there
have been many different versions of HTML. The most widely used version throughout the
2000’s was HTML 4.01. which became an official standard in 1999.
Another version XHTML, was a rewrite of HTML as an XML Language.XML is a standard
markup language that is used to create other markup languages. Hundreds of XML languages
are in use today, including GM (Geography Markup Language), MathML, MusicML and
RSS(Really Simple Syndication). Since each of these languages was written a common
language (XML), their content can easily be shared across applications. This makes XML
potentially very powerful, and it’s no surprise that the W3C would create an XML version of
HTML (again, called XHTML). XHTML became an official standard in 2000, and was updated
in 2002. XHTML is very similar to HTML, but has stricter rules. Strict rules are necessary for
all XML languages, because without it interoperability between applications would be
impossible.
3. HTML Versions

Since the early days of the web, there have been many versions of HTML:
Version Year
HTML 1991
HTML 2.0 1995
HTML3.2 1997
HTML 4.01 1999
XHTML 2000
HTML5 2014

4. Tags
HTML tags are the hidden keywords within a webpage that define how your web browser
must format and display the content.
Most tags must have two parts, an opening and closing part. For example, <html> is the
opening tag and </html> is the closing tag. Note that the closing tag has the same text as the
opening tag, but has an additional forward slash (/) character. I tend to interpret this as the
“end” or “close” character.
4.1 HTML Tag
HTML tags contain HTML elements, and give a command to browsers to read the document
as an HTML document.
<html>…………………</html>
4.2 Head Tag
Head tags define general information bout the document, page title, meta-tags, scripts and
links to follow, and other commands to browsers.

<head>
<title>HTML Tags-Head Tag</title>
</head>
4.3 Title Tag
Brief description of the web page.
<title>……………………………</title>
4.4 Body tag
Body tags identify the content of a web page.
<body>…………………………………………..</body>
5. HTML Attributes
 All HTML elements can have Attributes.
 Attributes provide additional information about an element.
 Attributes are always specified in the start tag.
 Attributes usually come in name/value pairs like: name=”value”

5.1 The href Attribute


HTML links are defined with <a> tag.

5.2 The src attribute


HTML links are defined with the <img> tag.
The filename of the image source is specified in the src attribute.

5.3 The width and height Attributes


Images in HTML have a set of size attributes, which specifies the width and height of the
image:

5.4 The alt attribute


The alt attribute specifies an alterative text be used, when an image cannot be displayed. The
alt attribute is also useful if the image does not exist.

5.5 The style Attribute


This style attribute is used to display the styling of an element, like color, font, size etc.
Required software
Software :- Notepad, Notepad++, Editplus, bluefish, terminal.
OS :- windowsXP,7,8,10,linux, Mac OSX

Project:-
Make simple web page using HTML.

<html>
<head>
<title>web page</title>
<head>
<body>This is web page</body>
</html>

Output:- This is a web page.


Project:-2
Make a we page using body attribute.

<html>
<head>
<title>web page</title>
<head>
<body text="red" bgcolor="yellow">This is a web page.</body>
</html>

Output:-
This is a web page
Project:-3
Make a web page using heading tag.

<html>
<head>
<title>web page</title>
</head>
<body><h1>This is 1st Heading</h1>
<h2>This is 2nd Heading</h2>
<h3>This is 3rd Heading</h3>
<h4>This is 4th Heading</h4>
<h5>This is 5th Heading</h5>
<h6>This is 6th Haeding</h6.
</html>
Click Here Output:-

This is 1st Heading


This is 2nd Heading
This is 3rd Heading
This is 4th Heading
This is 5th Heading

This is 6th Heading


Project:-
Paragraph tag<p> and line break tag<BR>
<html>
<head>
<title>web page</title>
</head>
<body>
<P>HTML Stands for Hypertext Markup Language</P>
</body>
</html>

Output:-
HTML Stands for Hypertext Markup Language
Project:-5
List Tag number Tag<OL>
<html>
<head>
<title>web page</title>
</head>
<body>
<ol><li>it tools and business
<li>internet
<li>c language
</ol>
</body>
</html>
Output:-
1. it tools and business
2. internet
3. c language
Project:-6
List Tag using unnumbered tag <ul>
<html>
<head>
<title>web page</title>
</head>
<body>
<ul><li>it tools and business
<li>internet
<li>c language
</ul>
</body>
</html>
Output:-
1. it tools and business
2. internet
3. c language
Project:-7
List Tag Type and start attribute.
<html>
<head>
<title>web page</title>
</head>
<body>
<ol START ="51">
<li>One level
<ol type="A"><li>two level outline
</ol>
</body>
</html>

Output:-
51. One level
A. two level outline
Project:-8
Preformatted text using<prc>tag.
<html>
<head>
<title>web page</title>
</head>
<body>
<pre>
<p> O level Student's result sheet
<p>Name Grade
Dharam Chand pass
</pre>
</body>
</html>

Output:-

Name Grade
Dharam Chand pass
Project:-9
Character Formatting tag.
<html>
<head>
<title>web page</title>
</head>
<body>
<pre>
<p> this is</b>Bold</b>
<p>this is<i>italic</i>
<p>this is <u>underline</u>
</body>
</html>
Output:-
this is Bold
this is italic
this is underline
Project:-10
Compact attribute
<html>
<head>
<title>web page</title>
</head>
<body>
<dl compact>
<dt>/p
<dd>display the files page.
<dt>/w
<dd>display the directories.
</dl>
</body>
</html>
Output:-
/p
display the files page.
/w
display the directories.
Project:-11
Font Tag
<html>
<head>
<title>web page</title>
</head>
<body>
<font color="red" size="8" face="times new roman">
National Institute of Electronics and Information Technology.
</body>
</html>
Output:-

National Institute of Electronics and


Information Technology.
Project:-12
Text Alignment
<html>
<head>
<title>web page</title>
</head>
<body>
<p align="right">i am in right.
<p align="center">i am in center.
<p align="left">i am in left.
</body>
</html>
Output:-
i am in right.
I am in center.
I am in left.
Project:-13
Change the height of Horizontal rule
<html>
<head>
<title>web page</title>
</head>
<body>
<p> this is Normal Rule.
<hr>
<p> this is a 100 pixel thick horizontal
<hr size="10">
</body>
</html>
Output:-
this is Normal Rule.

this is a 100 pixel thick horizontal


Project:-14
Create table using <Table> tag.
<html>
<head>
<title>web page</title>
</head>
<body>
<table border="i">
<tr bgcolor="red"><td>cource</td><td>duration</td>
</tr>
<tr bgcolor="green">
<td>O level></td><td>1 year</td>
<tr bgcolor="green"><td>A level</td>1 year</td></tr>
</body>
</html>
Output:-
1 year

course duration

O level> 1 year

A level 1 year
Project:-15
HTML Colors
<html>
<head>
<title>web page</title>
</head>
<body>
<font color="red">this is red color</font>
<p>
<font color="green">this is green color</font>
</font>
</body>
</html>
Output:-
this is red colour
this is green colour
Project:-16
Marquee Tag
<html>
<head>
<title>web page</title>
</head>
<body>
<marquee><b>NIELIT</b></marquee>
</body>
</html>
Output:-
NIELET

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy