HTML - Hyper Text Markup Language

⭐1. What is HTML?

What is HTML.png

HTML stands for HyperText Markup Language.
It is the standard language used to create werbpages.

  • Browsers like Chrome, Firefox, Edge read HTML.
  • HTML describes the structure of a webpage.
  • It uses tags to format text, images, links, tables, etc.

⭐2. Features of HTML

Features of HTML.png
  • Easy to learn
  • Use simple tags
  • Platform-independent
  • Displays text, images, videos
  • Links one page to another
  • Supported by all browsers
  • Forms the foundation of every website

<

⭐3. What is a Tag in HTML?

What is a Tag in HTML.png

Tags are keywords enclosed in < >

Examples:
  • < html >
  • < h1 >
  • < p >
  • < img >
  • < a >

Tags tell the browser how to display content.


⭐4. Types of Tags

Types of Tags.png

✓1. Paired (Container) Tags

Have opening and closing tags.

Example:
  • < html > < /html >
  • < body > < /body >
  • < p > < /p >

✓2. Empty (Self-closing) Tags

Do not need closing tag.

Example:
  • < br >
  • < hr >
  • < img >

⭐5. Basic structure of an HTML Document

basic structure of an html document.png

An HTML page contains:

  1. HTML Tag → wraps the whole page
  2. Head Section → title, metadata
  3. Body Section → visible content (text, images, links)

⭐6. Common HMTL Tags (Simple Definition)

Common HTML tags.png

✓ < h1 > to < h6 >

Headings (h1 = biggest, h6 = smallest)

✓ < p >

Paragraph

✓ < br >

Line break

✓ < hr >

Horizontal line

✓ < img >

Insert image

✓ < a >

Create a hyperlink

✓ < ul >, < ol >, < li >

Lists

✓ < table >, < tr >, < td >

Tables


⭐7. Attributes in HTML

Attributes in HTML.png

Attributes give extra information to a tag.

Examples:
  • src → image source
  • href → link address
  • width, height → size
  • style → Inline styling
  • alt → Image description

Example explanation: img tag uses src for image path and alt for description.


⭐8. HTML vs HTML5

HTML vs HTML5.png
HTML HTML5
Older version Latest version
Limited features Multimedia support
No audio/video tags < audio >, < video > present
No semantic tags Semantic tags available

⭐9. HTML5 Semantic Tags (Very Important)

HTML5 semantic tags.png

Semantic tags give meaning to strucute:

  • < header >
  • < nav >
  • < main >
  • < section >
  • < article >
  • < aside >
  • < footer >

These help in making websites professional.


⭐10. Forms in HTML (Easy Explanation)

Forms in HTML.png

Forms collect user input.

Form contains:
  • text box
  • email box
  • password box
  • submit button
  • radio & checkbox

Used for: login pages, signup forms, contact forms.


⭐11. Importance of HTML

Importance of HTML.png
  • Foundation of all websites
  • Works with CSS & JavaScript
  • Easy to learn
  • Used for webpages, forms, blogs, e-commerce

⭐12. Exam Questions (1-line Answers)

✓ Full form of HTML → HyperText Markup Language ✓ HTML is used to → Create webpages ✓ Tags are written in → Angle brackets ✓ < br > is → Empty tag ✓ < p > is → Container tag ✓ Largest heading → h1 ✓ Hyperlinks created using → < a > ✓ Structure of webpage starts with → HTML tag ✓ Semantic tag example → header ✓ < img > tag uses → src attribute