Scribd
Upload
28 views20 pages

HTML Basics

This document provides an overview of HTML basics: - HTML stands for Hypertext Markup Language and is used to describe the structure of web pages through a series of elements that tell browsers how to display content. - Common HTML elements include headings, paragraphs, lists, links, and images. Elements have an opening and closing tag that encapsulate content. - HTML pages have a head and body section, with the head containing meta information and the body comprising the visible page content. Elements like title define the page title.

Uploaded by

Ilda Çallaj
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
28 views20 pages

HTML Basics

This document provides an overview of HTML basics: - HTML stands for Hypertext Markup Language and is used to describe the structure of web pages through a series of elements that tell browsers how to display content. - Common HTML elements include headings, paragraphs, lists, links, and images. Elements have an opening and closing tag that encapsulate content. - HTML pages have a head and body section, with the head containing meta information and the body comprising the visible page content. Elements like title define the page title.

Uploaded by

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

HTML

HTML Basics
What is HTML?
 stands for Hyper Text Markup Language.
 it is the standard markup language to create web pages.
 describes the structure of a web page.
 consists of a series of elements which tell the browser how to
display the content
HTML elements
 <p> I am a paragraph. </p>

 A standard html element has 3 parts:


 Opening tag (<p>)
 Closing tag (</p>)
 Content (I am a paragraph.)
Nested element
 A nested element means an element that contains one or more
elements inside as a content. For example (div is the nested
element);
<div>
<p>
I am a paragraph in a div
</p>
</div>
Empty elements
 In HTML, there are some empty elements that do not have a
closing tag, neither content. Some of them are:
 <br> defines a line break.
 <hr> defines a horizontal rule break.
 <img> defines an image
HTML Structure

 There are two main


parts/elements in HTML:
head part
 head
 contains the elements about the
web page, like title, style,
link, etc.
body part
 body
 contains the elements that build the
web page, like p, h1, div, etc.
Some html rules
 An html document must start with <!DOCTYPE html>
declaration.
 A standard element must be closed.
 html is the root element in a web (html) page.
HTML Headings (h1, h2, h3, h4, h5, h6)
 HTML headings are defined with
 <h1>
 <h2>
 <h3>
 <h4>
 <h5>
 <h6> elements.
 These elements are used in body part of html.
 <h1> defines the most important; <h6> defines the least
important heading
head
 This element is one of the main part of html (header).
 It is the container of elements about the web page.
 Do not confuse it with headings <h1>, <h2>, etc.
title
 This element defines a title for the web page and its content is
shown in the title bar as the title of the web page.
 It is used in head part.
p
 This element defines a paragraph.
 Its content is shown as a paragraph.
 It is used in body element.
How to…
 You can use Notepad for writing html tags in your computer.
 After writing codes when you save your work save it in htm/html format.
 Open the file in a browser (like Chrome, Edge, Firefox, etc) to see the
result.

 When you want to edit the tags;


 right click on the file and select Open with -> Notepad.

NOTE: When you are editing the file and at the same time open in a browser, you don't
have to reopen the file but just Refresh (F5) the page.
Class work 1
 Make this web page with a proper title.
img
 img element
defines an image
 It is an empty
element.
 It is used with src
attribute which
defines the location
of the image.
 <img src="bee
eaters.jpg">
Class work 2
 Make this web page with a title
a
 a element defines a hyperlink.
 the link can be targeted
 to a location in the same web page
 to another web page in the same web site (local) or
 to another web page in another web site (public).
a
ul, ol, li
 ul defines an unordered list.
 ol defines an ordered list.
 li defines a list item in a list.
Class work 3
 Make this web page.
 Note: The links must be inside list items.
Thank you!

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