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

HTML5

The document provides an overview of HTML (Hyper Text Markup Language), explaining its purpose as the standard markup language for creating web pages and its structure, including elements and tags. It details the basic structure of an HTML document, the use of various HTML elements like headings, paragraphs, links, and images, as well as the importance of attributes. Additionally, it recommends text editors for writing HTML code and emphasizes the significance of the <!DOCTYPE html> declaration.

Uploaded by

tdsd17579
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)
11 views

HTML5

The document provides an overview of HTML (Hyper Text Markup Language), explaining its purpose as the standard markup language for creating web pages and its structure, including elements and tags. It details the basic structure of an HTML document, the use of various HTML elements like headings, paragraphs, links, and images, as well as the importance of attributes. Additionally, it recommends text editors for writing HTML code and emphasizes the significance of the <!DOCTYPE html> declaration.

Uploaded by

tdsd17579
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/ 8

Page |1

HTML-5
Golden Tutorials

What is HTML?
 HTML stands for Hyper Text Markup Language
 HTML is the standard markup language for creating Web pages
 HTML describes the structure of a Web page
 HTML consists of a series of elements
 HTML elements tell the browser how to display the content
 HTML is not a programing language.

What is an HTML Element?


An HTML element is defined by a start tag, some content, and an end tag:

<tagname> This is the content... </tagname>

The HTML element is everything from the start tag to the end tag:

<h1>My First Heading</h1>

<p>My first paragraph.</p>

Some HTML elements have no content (like the <br> element).These


elements are called empty elements. Empty elements do not have an end
tag!

Start tag Element End


content tag
<h1> ………………… </h1>
….
<p> ………………… </p>
….
<br> ………………… …………………
…. ….
<b> ……………………. </b>

<u> ……………………. </u>

HTML TUTORIALS
Page |2

<strong> ……………………. </strong>

HTML Page Structure

<!DOCTYPE html >

<html>

<head>

<title>Page title</title>

</head>

<body>

<h1>This is a heading</h1>

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

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

</body>

</html>

Figure 1: HTML preview

 The <!DoCTYPE html> declaration defines that this document is an


HTML5 document
 The <html> element is the root element of an HTML page
 The <head> element contains meta information about the HTML page
 The <title> element specifies a title for the HTML page (which is shown in
the browser's title bar or in the page's tab)
 The <body> element defines the document's body, and is a container for
all the visible contents, such as headings, paragraphs, images, hyperlinks,
tables, lists, etc.
 The <h1> element defines a large heading

HTML TUTORIALS
Page |3

 The <p> element defines a paragraph

Remember :

All the tags will be small not big!

HTML Editors
People use a lot of text editors most of them uses notepad and textedit for
writing notes and for editing even codes too.

For recommendation, download a text editor.

The text editor are :-

 Brackets
 VS code.com or vscode.dev(online version)
 Vim.com
 Sublime Text.com
 Atom.io

Open the text editor and start writing code and save it as “index.html” or
“.htm”.

HTML Document
Document type is called “<DOCTYPE html>”
Or sometimes like

 <Doctype html>
 <doctype html>
 <Doctype Html>

HTML TUTORIALS
Page |4

Can be written like this and must be written in the html.

The <!DOCTYPE> declaration for HTML5 is:

<!DOCTYPE html>

HTML Headings and paragraph


Heading are {1-6} types:
<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>
Figure 2 Heading 1-
6

HTML Links
HTML links are defined with the <a> tag:
The link's destination is specified in the href attribute.

<a href="https://www.w3schools.com">This is a link</a>

<a href="https://htmltutorials.com">This is a link</a>

HTML TUTORIALS
Page |5

Figure 3 html links


preview

HTML Image
HTML images are defined with the <img> tag.

The source file (src), alternative text (alt), width, and height are provided as
attributes:

<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="14


2">

Tag Description

Figure 4 html
image
<html> Defines the root of an HTML document

HTML TUTORIALS
Page |6

<body> Defines the document's body

<h1> to <h6> Defines HTML headings

The <br> tag defines a line break, and is an empty element without a
closing tag.

HTML Attributes
HTML attributes provide additional information about HTML elements.

All HTML elements can have attributes

Attributes provide additional information about elements

Attributes are always specified in the start tag

Attributes usually come in name/value pairs like: name="value"

The href Attribute


The <a> tag defines a hyperlink. The href attribute specifies the URL of the
page the link goes to:

<a href="https://www.w3schools.com">Visit W3Schools</a>

HTML TUTORIALS
Page |7

HTML Image
HTML images are defined with the <img> tag.

The source file (src), alternative text (alt), width, and height are provided as
attributes:

<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="14


2">

The style Attribute


The style attribute is used to add styles to an element, such as color, font, size,
and more.

<p style="color:red;">This is a red paragraph.</p>

HTML TUTORIALS
Page |8

The lang Attribute


You should always include the lang attribute inside the <html> tag, to declare the
language of the Web page. This is meant to assist search engines and browsers.

<!DOCTYPE html>
<html lang="en">
<body>
...
</body>
</html>

The title Attribute


The title attribute defines some extra information about an element.

<p title="I'm a tittle">This is a paragraph.</p>

HTML TUTORIALS

You might also like