Scribd
Upload
2 views

HTML

HTML, or HyperText Markup Language, is a markup language used for creating web pages and applications. It consists of various elements defined by tags, attributes, and formatting options, allowing for the structuring and presentation of content on the web. Key components include headings, paragraphs, links, and images, each with specific attributes to enhance functionality and appearance.

Uploaded by

rowel elca
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
2 views

HTML

HTML, or HyperText Markup Language, is a markup language used for creating web pages and applications. It consists of various elements defined by tags, attributes, and formatting options, allowing for the structuring and presentation of content on the web. Key components include headings, paragraphs, links, and images, each with specific attributes to enhance functionality and appearance.

Uploaded by

rowel elca
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 28

HTML

Empowerment Technologies
HTML
HTML stands for HyperText Markup Language.

HTML is used to create web pages and web


applications.

HTML is widely used language on the web.

We can create a static website by HTML only.

Technically, HTML is a Markup language rather than


a programming language.
WHAT IS HTML
HTML is an acronym which stands for Hyper Text
Markup Language which is used for creating web pages
and web applications.

Hyper Text: HyperText simply means "Text within Text."


A text has a link within it, is a hypertext. Whenever you
click on a link which brings you to a new webpage, you
have clicked on a hypertext. HyperText is a way to link
two or more web pages (HTML documents) with each
other.
WHAT IS HTML
Markup language: A markup language is a computer
language that is used to apply layout and formatting
conventions to a text document. Markup language
makes text more interactive and dynamic. It can turn
text into images, tables, links, etc.

Web Page: A web page is a document which is


commonly written in HTML and translated by a web
browser. A web page can be identified by entering an
URL. A Web page can be of the static or dynamic type.
Description of HTML
Example

<!DOCTYPE>: It defines the document type or it


instruct the browser about the version of HTML.

<html > :This tag informs the browser that it is an


HTML document. Text between html tag describes
the web document. It is a container for all other
elements of HTML except <!DOCTYPE>
Description of HTML
Example
<head>: It should be the first element inside the
<html> element, which contains the
metadata(information about the document). It
must be closed before the body tag opens.

<title>: It is used to add title of that HTML page


which appears at the top of the browser window.
It must be placed inside the head tag and should
close immediately.
Description of HTML
Example
<body> : Text between body tag describes the body
content of the page that is visible to the end user.
This tag contains the main content of the HTML
document.

<h1> : Text between <h1> tag describes the first


level heading of the webpage.

<p> : Text between <p> tag describes the


paragraph of the webpage.
HTML text Editors

-An HTML file is a text file, so to create an HTML file we


can use any text editors.
-Text editors are the programs which allow editing in a
written text, hence to create a web page we need to
write our code in some text editor.
-There are various types of text editors available which
you can directly download, but for a beginner, the
best text editor is Notepad (Windows) or TextEdit
(Mac).
-other professional text editors which are, Notepad++,
Sublime Text, Vim, etc.
Building blocks of HTML

Tags: An HTML tag surrounds the content and apply


meaning to it. It is written between < and > brackets.

Attribute: An attribute in HTML provides extra


information about the element, and it is applied
within the start tag. An HTML attribute contains two
fields: name & value.
Building blocks of HTML

Elements: An HTML element is an individual


component of an HTML file. In an HTML file,
everything written within tags are termed as HTML
elements.
HTML Tags

HTML tags are like keywords which defines that how


web browser will format and display the content. With
the help of tags, a web browser can distinguish
between an HTML content and a simple content.
HTML tags contain three main parts: opening tag,
content and closing tag. But some HTML tags are
unclosed tags.
HTML Tags
Unclosed HTML Tags

Some HTML tags are not closed, for example br and hr.

<br> Tag: br stands for break line, it breaks the line of


the code.

<hr> Tag: hr stands for Horizontal Rule. This tag is used


to put a line across the webpage.
HTML Attribute

HTML attributes are special words which


provide additional information about the
elements or attributes are the modifier of
the HTML element.

Each element or tag can have attributes,


which defines the behaviour of that element.
HTML Attribute
Attributes should always be applied with start tag.

The Attribute should always be applied with its name and


value pair.

The Attributes name and values are case sensitive, and it is


recommended that it should be written in Lowercase only.

You can add multiple attributes in one HTML element, but


need to give space between two attributes.

<p style="height: 50px; color: blue">It will add style


property in element</p>
<p style="color: red">It will change the color of
content</p>
HTML Elements

An HTML file is made of elements. These elements


are responsible for creating web pages and define
content in that webpage. An element in HTML usually
consist of a start tag <tag name>, close tag </tag
name> and content inserted between them.
Technically, an element is a collection of start tag,
attributes, end tag, content between them.
HTML Formatting

HTML Formatting is a process of formatting text for


better look and feel. HTML provides us ability to
format text without using CSS. There are many
formatting tags in HTML. These tags are used to
make text bold, italicized, or underlined.

<p> <b>Write Your First Paragraph in bold


text.</b></p>
HTML Heading
A HTML heading or HTML h tag can be defined as a
title or a subtitle which you want to display on the
webpage. When you place the text within the heading
tags <h1>.........</h1>, it is displayed on the browser
in the bold format and size of the text depends on the
number of heading.

There are six different HTML headings which are


defined with the <h1> to <h6> tags, from highest
level h1 (main heading) to the least level h6 (least
important heading).
HTML Heading

<h1>Heading no. 1</h1>


<h2>Heading no. 2</h2>
<h3>Heading no. 3</h3>
<h4>Heading no. 4</h4>
<h5>Heading no. 5</h5>
<h6>Heading no. 6</h6>
HTML Paragraph

HTML paragraph or HTML p tag is used to define a


paragraph in a webpage. Let's take a simple example
to see how it work. It is a notable point that a browser
itself add an empty line before and after a paragraph.
An HTML <p> tag indicates starting of new
paragraph.
HTML Paragraph

<p>This is first paragraph.</p>


<p>This is second paragraph.</p>
<p>This is third paragraph.</p>
HTML Anchor
The HTML anchor tag defines a hyperlink that links
one page to another page. It can create hyperlink to
other web page as well as files, location, or any URL.
The "href" attribute is the most important attribute of
the HTML a tag. and which links to destination page
or URL.

href attribute of HTML anchor tag


The href attribute is used to define the address of the
file to be linked. In other words, it points out the
destination page.
HTML Anchor

<a href="second.html">Click for Second Page</a>


HTML Image

HTML img tag is used to display image on the web


page. HTML img tag is an empty tag that contains
attributes only, closing tags are not used in HTML
image element.
Attributes of HTML img
tag

1) src
It is a necessary attribute that describes the source or
path of the image. It instructs the browser where to
look for the image on the server.

The location of image may be on the same directory or


another server.
Attributes of HTML img
tag

2) alt
The alt attribute defines an alternate text for the image,
if it can't be displayed. The value of the alt attribute
describe the image in words. The alt attribute is
considered good for SEO prospective.
Attributes of HTML img
tag
3) width
It is an optional attribute which is used to specify the
width to display the image. It is not recommended
now. You should apply CSS in place of width attribute.

4) height
It h3 the height of the image. The HTML height attribute
also supports iframe, image and object elements. It is
not recommended now. You should apply CSS in place
of height attribute.
Attributes of HTML img
tag

<img src="animal.jpg" height="180" width="300"


alt="animal image">

You might also like