Scribd
Upload
3 views

HTML Presentation

The presentation provides an overview of HTML, explaining its purpose as the language for creating web pages and its structure, including essential tags and elements. It covers common HTML tags, attributes, lists, links, images, and forms, providing examples for each. The presentation concludes with a thank you message to the audience.

Uploaded by

thummalavishnutanvi
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
3 views

HTML Presentation

The presentation provides an overview of HTML, explaining its purpose as the language for creating web pages and its structure, including essential tags and elements. It covers common HTML tags, attributes, lists, links, images, and forms, providing examples for each. The presentation concludes with a thank you message to the audience.

Uploaded by

thummalavishnutanvi
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/ 13

PowerPoint presentation

on HTML
What is HTML?
1. HTML stands for Hyper Text Markup Language.
2. It’s the language used to create web pages.
3. HTML tells a web browser how to display the text,
images, videos, and other content on a webpage.
4. HTML is made up of elements or tags.
5. Websites are built using HTML, and it's the
foundation of web design.
HTML Structure

1.<!DOCTYPE html>: Tells the browser that this is an HTML5


document.
2.<html>: This tag wraps all the HTML code.
3.<head>: Contains information about the document (like the
title and links to stylesheets or scripts).
4.<body>: Contains the content that the browser will display to
the user.
Example
 <!DOCTYPE html>
 <html>
 <head>
 <title>My First Webpage</title>
 </head>
 <body>
 <h1>Welcome to My Webpage!</h1>
 <p>This is a paragraph of text.</p>
 </body>
 </html>
HTML Tags

•HTML Tags are used to define elements on a webpage.


•Tags tell the browser what type of content to display and how to format it.
•A typical HTML tag looks like this:
•<tag name>Content</tag name>
•Some tags like <img> don’t need closing tags.
Example Tags:
•<h1>: Heading 1 (largest text)
•<p>: Paragraph
•<a>: Anchor (used for links)
Common HTML Tags
•Headings: Used for titles and section names. They range from <h1>
(largest) to <h6> (smallest).
•Example:
html
<h1>Welcome to My Site</h1>
•Paragraph: Used to display blocks of text.
•Example:
html
<p>This is a paragraph of text on my webpage.</p>
•Links: Used to create clickable links to other pages.
•Example:
html
<a href="https://www.example.com">Click here to visit Example</a>
Attributes in HTML
•Attributes provide additional information about
an element.
•They are added inside the opening tag.
•Common Attributes:
•href: Specifies the URL of a link.
•src: Specifies the source of an image.
•alt: Provides alternative text for an image.
Examples:
•Link:
html
<a href="https://www.wikipedia.org">Visit
Wikipedia</a>
•Image:
html
<img src="cat.jpg" alt="A cute cat">
HTML Lists
•HTML allows you to create two types of
lists:
•Unordered List (bulleted):
•Use the <ul> tag for unordered
lists.
•Each item is inside an <li> tag.
•Example:
html
<ul> <li>Item 1</li> <li>Item 2</li>
</ul>
•Ordered List (numbered):
•Use the <ol> tag for ordered
lists.
•Each item is inside an <li> tag.
•Example:
html
<ol> <li>First step</li> <li>Second
Creating Links in HTML

•Links allow users to click and move to another webpage or section.


•The <a> tag creates links, and the href attribute specifies where
the link goes.
Example:
html
<a href="https://www.example.com">Visit Example</a>
•Links can also open in new tabs with the target="_blank" attribute:
html
<a href="https://www.example.com" target="_blank">Visit Example
in a new tab</a>
Inserting Images

•Images make your webpage more interesting and


visually appealing.
•Use the <img> tag to insert an image on your webpage.
•Attributes:
•src: Specifies the source (file path) of the image.
•alt: Describes the image if it can’t be loaded or for
accessibility.
Example:
html
<img src="dog.jpg" alt="A cute dog">
HTML Forms
•Forms are used to collect information from users, like signing up for an account
or entering a search query.
•Common form elements:
•<input>: For text input, checkboxes, and more.
•<button>: For buttons.
•<label>: To add labels to form fields.
Example of a simple form:
html
<form> <label for="name">Your Name:</label> <input type="text"
id="name" name="name"> <button type="submit">Submit</button>
</form>
Here is a example
That concludes my presentation.
Thank you for your attention and
time today. I hope you found the
information helpful. Goodbye,
and have a wonderful day ahead.

You might also like