Lesson 3
HTML Introduction
TLE 8
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 elements label pieces of content
such as "this is a heading", "this is a
paragraph", "this is a link", etc.
HTML History
Since the early days of the
World Wide Web, there have
been many versions of HTML:
QUEZON CAMARINES HIGH SCHOOL INC.
Complete name
Y
Example Explained
•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
•The <p> element defines a paragraph
What is an HTML Element?
An HTML element is defined by a start tag, some
content, and an end tag:
<tagname> Content goes here... </tagname>
The HTML element is everything from the start tag to
the end tag:
<h1>My First Heading</h1>
<p>My first paragraph.</p>
Start tag Element content End tag
<h1> My First Heading </h1>
<p> My first paragraph. </p>
<br> none none
Web Browsers
The purpose of a web browser
(Chrome, Edge, Firefox, Safari) is to
read HTML documents and display
them correctly.
A browser does not display the HTML
tags, but uses them to determine how
to display the document:
HTML Page Structure
Below is a visualization of an
HTML page structure:
Notepad
is a text editor, i.e., an app specialized
in editing plain text. It can edit text files
(bearing the ". txt" filename extension)
and compatible formats, such as batch
files, INI files, and log files. Notepad
offers only the most basic text
manipulation functions, such as finding
and replacing text.
How to open Notepad?
To open Notepad, select the Start
button, enter Notepad, then select
Notepad from the results.
Notepad
has always been one of the most useful apps in
Windows, and that holds true in both Windows 10
and Windows 11. Whenever you need to write a
few things, jot down some thoughts, or simply
need to get help in Windows, Notepad is right
there at your fingertips. But, before anything else,
you should know how to open Notepad on your
computer. So we thought it would be a good idea
to tell you all the ways in which you can
launch Notepad. Want to know them? Read on and
you might be amazed by how many and how
different they can be, from simple double-clicks to
desktop and keyboard shortcuts, and even
Windows commands for Notepad:
How to open Notepad using search
Example #2
TLE-8 Information And Communication Technology

TLE_8/PowerpointPresentation/Project_8lo

  • 1.
  • 2.
    What is HTML? •HTMLstands 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 elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a link", etc.
  • 3.
    HTML History Since theearly days of the World Wide Web, there have been many versions of HTML:
  • 6.
    QUEZON CAMARINES HIGHSCHOOL INC. Complete name
  • 7.
    Y Example Explained •The <!DOCTYPEhtml> 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 •The <p> element defines a paragraph
  • 8.
    What is anHTML Element? An HTML element is defined by a start tag, some content, and an end tag: <tagname> Content goes here... </tagname> The HTML element is everything from the start tag to the end tag: <h1>My First Heading</h1> <p>My first paragraph.</p>
  • 9.
    Start tag Elementcontent End tag <h1> My First Heading </h1> <p> My first paragraph. </p> <br> none none
  • 10.
    Web Browsers The purposeof a web browser (Chrome, Edge, Firefox, Safari) is to read HTML documents and display them correctly. A browser does not display the HTML tags, but uses them to determine how to display the document:
  • 12.
    HTML Page Structure Belowis a visualization of an HTML page structure:
  • 14.
    Notepad is a texteditor, i.e., an app specialized in editing plain text. It can edit text files (bearing the ". txt" filename extension) and compatible formats, such as batch files, INI files, and log files. Notepad offers only the most basic text manipulation functions, such as finding and replacing text.
  • 15.
    How to openNotepad? To open Notepad, select the Start button, enter Notepad, then select Notepad from the results.
  • 16.
    Notepad has always beenone of the most useful apps in Windows, and that holds true in both Windows 10 and Windows 11. Whenever you need to write a few things, jot down some thoughts, or simply need to get help in Windows, Notepad is right there at your fingertips. But, before anything else, you should know how to open Notepad on your computer. So we thought it would be a good idea to tell you all the ways in which you can launch Notepad. Want to know them? Read on and you might be amazed by how many and how different they can be, from simple double-clicks to desktop and keyboard shortcuts, and even Windows commands for Notepad:
  • 17.
    How to openNotepad using search
  • 18.
    Example #2 TLE-8 InformationAnd Communication Technology