HTML
HyperText Markup Language
used to create and structure
content on the web.
It defines the structure of
web pages using a system of
tags and attributes.
Usage of HTML
Web Creation
Web Pages
Mobile application
development
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
A Simple HTML Document
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
HTML Page Structure
The content inside the <title> element
will be shown in the browser's title bar
or in the page's tab.
The content inside the <body>
section will be displayed in a
browser.
HTML Headings
HTML headings are defined with the <h1> to <h6> tags.
<h1> defines the most important heading. <h6> defines the least important heading.
HTML Paragraphs
HTML paragraphs are defined with the <p> tag:
HTML <pre> Element
The <pre> tag stands for preformatted text.
It is used to display text exactly as you type it, including spaces, line breaks, and
indentation.
HTML Horizontal Rules
The <hr> element is used to separate content in an HTML page:
HTML Line Breaks
Use <br> if you want a line break (a new line) without starting a new paragraph:
HTML Links
HTML links are defined with the <a> tag:
The link's destination is specified in the href attribute.
Attributes are used to provide additional information about HTML elements.
HTML Images
HTML images are defined with the <img> tag.
The source file (src), alternative text (alt), width, and height are provided as attributes:
The link's destination is specified in the href attribute.
Attributes are used to provide additional information about HTML elements.
HTML Elements
The HTML element is everything from the start tag to the end tag:
Content
<h1> My First Heading </h1> Element
Opening Tag Closing Tag
HTML Attributes
Attributes provide additional information about elements.
The <a> tag defines a hyperlink.
The href attribute specifies the URL of the page the link goes to:
The <img> tag is used to embed an image in an HTML page.
The src attribute specifies the path to the image to be displayed:
The <img> tag should also contain the width and height attributes,
which specify the width and height of the image (in pixels):
Frontend vs. Frontend Development Basics
HTML, CSS, and JavaScript elements
Backend
Backend Development Essentials
Overview Focus on server-side logic and databases
Full-Stack Development Insights
Combining frontend and backend technologies effectively
Importance of Tools
Utilizing modern code editors for efficiency
Essential Tools
and Setup
Code editor choice
VS Code enhances productivity and
efficiency.
Debugging tools matter
Chrome DevTools offers powerful
debugging features.
Thank you!