Scribd
Upload
3 views4 pages

HTML Basic

HTML (HyperText Markup Language) is the standard markup language for creating web pages, serving as the structure of a website. It consists of various tags that define elements like headings, paragraphs, links, images, and lists, with a basic document structure outlined. Mastering HTML fundamentals is essential before progressing to CSS and other web development topics.

Uploaded by

codetherapist.pita
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
3 views4 pages

HTML Basic

HTML (HyperText Markup Language) is the standard markup language for creating web pages, serving as the structure of a website. It consists of various tags that define elements like headings, paragraphs, links, images, and lists, with a basic document structure outlined. Mastering HTML fundamentals is essential before progressing to CSS and other web development topics.

Uploaded by

codetherapist.pita
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

🌍 What is HTML?

HTML (HyperText Markup Language) is the standard language used to create web pages.

It is not a programming language.


It is a markup language used to structure content on a webpage.

Think of HTML as the skeleton of a website.

🧱 Basic Structure of an HTML Page

Every HTML document has this basic structure:

<!DOCTYPE html> <html> <head> <title>My First Website</title> </head> <body> <h1>Hello
World</h1> <p>This is my first web page.</p> </body> </html>

Let’s break it down:

Tag Meaning

<!DOCTYPE html> Tells the browser this is HTML5

<html> Root of the page

<head> Contains information about the page

<title> Title shown on browser tab


Tag Meaning

<body> Visible content

🏷 HTML Tags

HTML uses tags.

Most tags:

 Have an opening tag <tag>

 Have a closing tag </tag>

Example:

<p>This is a paragraph</p>

Some tags do NOT have closing tags:

<br> <img> <hr>

🔠 Headings in HTML

HTML has 6 heading levels:

<h1>Main Heading</h1> <h2>Sub Heading</h2> <h3>Smaller Heading</h3> <h4>...</h4>


<h5>...</h5> <h6>Smallest Heading</h6>

👉 <h1> is the biggest


👉 <h6> is the smallest

📄 Paragraphs

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

To break a line:

<br>

To draw a horizontal line:


<hr>

🔗 Links

<a href="[Link] Google</a>

 href = where the link goes

🖼 Images

<img src="[Link]" alt="My Image">

 src = image location

 alt = description of image

📋 Lists

1️⃣ Ordered List (Numbers)

<ol> <li>HTML</li> <li>CSS</li> <li>JavaScript</li> </ol>

2️⃣ Unordered List (Bullets)

<ul> <li>Python</li> <li>Java</li> <li>C++</li> </ul>

🧠 Attributes in HTML

Attributes give extra information.

Example:

<a href="[Link] target="_blank">

 href → destination

 target="_blank" → opens in new tab

🏗 Simple Practice Example

Create this in Notepad and save as:


[Link]

<!DOCTYPE html> <html> <head> <title>Peter's Website</title> </head> <body> <h1>Welcome


to My Website</h1> <h2>About Me</h2> <p>I am learning HTML step by step.</p> <h2>My
Skills</h2> <ul> <li>HTML</li> <li>Python</li> <li>JavaScript</li> </ul> </body> </html>

Open it in your browser.

That’s how websites start 🚀

🎯 What You Must Master First

Before moving to CSS:

✅ Structure of HTML
✅ Tags and elements
✅ Headings and paragraphs
✅ Lists
✅ Links
✅ Images

If you want, we can now:

1. Do HTML exercises 📝

2. Learn HTML forms

3. Learn semantic HTML

4. Build a small project together

You’re building real foundations now — keep going 💪

You might also like