html symentric tags and use of

🔹 What is ?

is a non-semantic inline tag.

It is mainly used to style or manipulate a small part of text using CSS or JavaScript.

🔹 Main Uses of

1️⃣ Style specific words or letters

<p>Hello <span style="color:red;">World</span></p>

👉 Only World becomes red.

**

2️⃣ Apply CSS class to part of text**

<style>

.highlight {

background-color: yellow;

}

</style>

<p>This is <span class="highlight">important</span> text</p>

3️⃣ JavaScript DOM manipulation

`

Hello mapla

<br>
document.getElementById("name").innerText = "Deva";<br>
`

4️⃣ Group inline elements (without line break)

<span>HTML</span>

<span>CSS</span>

<span>JS</span>

🔷 What are HTML Semantic Tags?

Semantic tags na

👉 Tag name paathale adhu enna work pannum nu puriyum

Browser-kum, developer-kum, SEO-kum clear meaning kudukkum tags.

🔹 Common HTML Semantic Tags

1️⃣

Website / section-oda top part

Logo, title, navbar irukkum

<header>

<h1>My Website</h1>

</header>



2️⃣

Navigation links irukkura area

<nav>

<a href="#">Home</a>

<a href="#">About</a>

</nav>

3️⃣

Page-oda main content

<main>

<p>Main content here</p>

</main>

**

4️⃣ **

Related content-a group panna

<section>

<h2>About Us</h2>

<p>Company details</p>

</section>

**

5️⃣ **

Independent content

(blog, post, news)

<article>

<h2>Blog Title</h2>

<p>Blog content</p>

</article>

**

6️⃣ **

Side content

(ads, related links)

<aside>

<p>Related posts</p>

</aside>

7️⃣

Page-oda bottom part

Copyright, links

<footer>

<p>© 2026 My Website</p>

</footer>