Presentation on HTML By Batra Computer Centre

Email: info.jatinbatra@gmail.com
Ph. No. :9729666670,4000670 Website: www.batracomputercentre.com

Content
What is HTML?
Why HTML?
HTML Structure
HTML Elements
HTML Attributes
Basic Tags
HTML Styles
Text Formatting
HTML Quotation
HTML with CSS
HTML Links

What is HTML?
HTML is the standardmarkuplanguagefor creating Webpages.
 HTML describes the structure of Web pages using markup
 HTML elements are the building blocks of HTML pages
 HTML elements are represented by tags
 HTML tags label pieces of content such as "heading", "paragraph", "table", and
so on
 Browsers do not display the HTML tags, but use them to render the content of
the page

HTML Stands For…
HTML
Hyper Text Markup Language

Why HTML Is Used?
The web is based on HTML more
than anything else.
Anything written carefully in HTML
will wok on any browser or OS.
It is light inn weight and easy to
learn.
It is quick to code and compatible
with all the browser and OS.

HTML Structure

<html>
</html>
<head>
</head>
<title>Page Title</title>
<body>
</body>
<p>This is a paragraph</p>
<h1>This is the heading</h1>
<p>This is another paragraph</p>

HTML ELEMENTS
An HTML element usually consists of a start tag and end tag, with the
content inserted in between:
<tagname>Content goes here...</tagname>
The HTML element is everything from the start tag to the end tag:
<p>Myfirst paragraph.</p>
Start Tag Element Content End Tag
<h1> My first heading </h1>
<p> My first Paragraph </p>
<br>

HTML Attribute
Attributes provide additional informationabout HTML elements.
• 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"

HTML Attributes

Basic HTML Tags

HTML Styles
Setting the styleof an HTML element, can be done withthe style
attribute.
The property is a CSS property. The valueis a CSS value.
<tagname style="property:value;">

 The background-color property defines the background color for an HTML
element.
 The color property defines the text color for an HTML element:
<body style="background-color:powderblue;">
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>
Examples:-

 The font-family property defines the font to be used for an HTML element:
 The font-size property defines the text size for an HTML element:
 The text-alignproperty defines the horizontal text alignment for an HTML
element:
<h1 style="text-align:center;">Centered Heading</h1>
<p style="text-align:center;">Centered paragraph.</p>
<h1 style="font-size:300%;">This is a heading</h1>
<p style="font-size:160%;">This is a paragraph.</p>
<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>

Text Formatting
• HTML also defines special elements for defining text with a
special meaning.
• HTML uses elements like <b> and <i> for formatting output,
like bold or italic text.
• Formatting elements were designed to display special types of text:

HTML Quotation
• The HTML <q> element defines a short quotation.
• Browsers usually insert quotation marks around the <q> element.
<p>WWF's goal is to: <q>Build a future
where people live in harmony with
nature.</q></p>

• The HTML <blockquote> element defines a section that is
quoted from another source.
• Browsers usually indent <blockquote> elements.
<p>Here is a quote from WWF's website:</p>
<blockquote cite="http://www.worldwildlife.org/who/index.
html">
For 50 years, WWF has been protecting the future of nature.
The world's leading conservation organization,
WWF works in 100 countries and is supported by
1.2 million members in the United States and
close to 5 million globally.
</blockquote>

Styling HTML With CSS
• CSS stands for Cascading Style Sheets.
• CSS describes how HTML elements are to be displayedon screen, paper,
or in other media.
• CSS saves a lot of work. It can control the layout of multiple web pages
all at once.
• CSS can be added to HTML elements in 3 ways:
– Inline - by using the style attribute in HTML elements
– Internal - by using a <style> element in the <head> section
– External - by using an external CSS file

HTML Links - Hyperlinks
• HTML links are hyperlinks.
• You can click on a link and jump to another document.
• When you move the mouse over a link, the mouse arrow will
turn into a little hand.
Syntax:-
<a href="url">link text</a>

Example
• The href attribute specifies the destination address
(https://www.google. com) of the link.
• Local Links:-
<a href="https://www.google.com ">Visit our
HTML tutorial</a>
<a href="html_images.asp">HTML Images</a>

HTML Link – Image as a Link
It is common to use images as links:
<a href="default.asp">
<img src="smiley.gif" alt="HTML
tutorial" style="width:42px;height:42px;border:0;">
</a>

About Us
We have own Centre library that has sufficient books of great
authors for our students.
Notes prepared by our teachers
are provides to every student for
their review. We also provide
particular software’s our students
on which they are pursuing their courses. Extra classes are given to
those students who need some extra time or in case miss due to some
reason.

SCO 15, Dayal Bagh,
Near Hanuman Mandir,
Ambala Cantt.
Phn No.: 9729666670,0171-4000670
Website:www.batracomputercentre.com

Presentation on HTML By Batra Computer Centre

Recommended

Recommended

More Related Content

Similar to Presentation on HTML By Batra Computer Centre

Similar to Presentation on HTML By Batra Computer Centre (20)

More from Batra Computer Centre

More from Batra Computer Centre (20)

Recently uploaded

Recently uploaded (20)

Presentation on HTML By Batra Computer Centre