Hey Lahari!
Welcome to your very own webpage! This is the starting point of a fun journey into creating things on the internet.
Lesson 1: What in the world is an HTML Tag?
Tags are like little labels you wrap around your text to tell the browser what that text is.
For Example:
The Code:
<h1>My First page</h1>
<p>This is my first paragraph!</p>How it Looks:
My First page
This is my first paragraph!
Let's Try It!
Live Preview:
Your result will appear here...
Lesson 2: Let's Add Some Pictures!
A webpage without images is a bit boring, right? Let's add one! For images, we use the <img> tag.
The <img> tag is special because it's "self-closing" - it doesn't need a separate closing tag. Instead, it uses attributes to work. Think of attributes as extra information for the tag.
src— This stands for "source". It tells the browser the URL (the web address) of the image you want to show.alt— This is "alternative text". It's a description of the image. This is super important for screen readers and if the image fails to load.
The Code:
<img src="https://manish.rocks/L.png" alt="Lahari Image">How it Looks:
Your Turn!
Live Preview:
Your image will appear here...
Lesson 3: Getting Organized with Lists
Sometimes you need to list things, like your favorite movies or steps in a recipe. HTML has you covered with list tags!
<ul>is an unordered list — it creates a list with bullet points.<ol>is an ordered list — it creates a numbered list.<li>is a list item — every item in any list goes inside one of these.
The Code:
<h4>My Trip List</h4>
<ul>
<li>Shimla</li>
<li>Pondicherry</li>
<ol>Paris</ol>
</ul>How it Looks:
My Trip List
- Shimla
- Pondicherry
- 1. Paris
Let's Make a List!
Bulleted List Preview:
Numbered List Preview:
Lesson 4: Let's Travel! (I mean the web, wiht links)
Links are like magical doors in HTML that take you from one page to another — or even to a specific part of the same page!
<a>is the anchor tag — it creates a link.- The
hrefattribute holds the destination URL — where the link will take you. - Anything between the opening and closing
<a>tags becomes the clickable text or content.
For Example:
The Code:
<p>My friend is teaching me html. his website<a href="https://manish.rocks">manish</a>.</p>How it Looks:
My friend is teaching me html. his website manish.
Create Your Own Link!
Live Preview:
Your link will appear here...