0% found this document useful (0 votes)
2 views2 pages

Simple HTML CSS Lab Programs

The document provides 16 simple HTML and CSS lab programs covering various fundamental concepts. These include basic HTML structure, text formatting, multimedia elements, layout design, lists, tables, hyperlinks, frames, forms, and different CSS styling techniques. Each program is illustrated with code snippets demonstrating practical applications of HTML and CSS features.

Uploaded by

bhagyamath3174
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
0% found this document useful (0 votes)
2 views2 pages

Simple HTML CSS Lab Programs

The document provides 16 simple HTML and CSS lab programs covering various fundamental concepts. These include basic HTML structure, text formatting, multimedia elements, layout design, lists, tables, hyperlinks, frames, forms, and different CSS styling techniques. Each program is illustrated with code snippets demonstrating practical applications of HTML and CSS features.

Uploaded by

bhagyamath3174
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

Simple HTML & CSS Lab Programs (16)

1. Basic HTML Structure


<!DOCTYPE html>
<html>
<head><title>Basic HTML</title></head>
<body>
<h1>Welcome to HTML</h1>
<p>This is my first HTML program.</p>
</body>
</html>

2. Text Formatting
<b>Bold</b><br>
<i>Italic</i><br>
<u>Underline</u><br>
<strong>Strong</strong><br>
<em>Emphasized</em><br>
<mark>Highlighted</mark><br>
H<sub>2</sub>O<br>
X<sup>2</sup>

3. Multimedia
<img src="[Link]" width="200">
<audio controls><source src="song.mp3"></audio>
<video controls width="300"><source src="video.mp4"></video>

4. Layout
<header><h1>My Website</h1></header>
<nav>Home | About | Contact</nav>
<section><p>Welcome</p></section>
<footer>Copyright 2026</footer>

5. Lists
<ol><li>HTML</li><li>CSS</li></ol>
<ul><li>Apple</li><li>Mango</li></ul>

6. Table
<table
border='1'><tr><th>Name</th><th>Age</th></tr><tr><td>Rahul</td><td>20</
td></tr></table>

7. Hyperlink
<a href='[Link] Google</a>
8. Frames
[Link]:
<frameset cols='30%,70%'><frame src='[Link]'><frame
src='[Link]'></frameset>

9. Form
<form>Name:<input type='text'><br><input type='submit'></form>

10. Inline CSS


<h1 style='color:red'>Hello</h1>

11. Background & Font


<style>body{background:lightblue;} h1{color:red;}</style>

12. List CSS


<style>ul{list-style-type:square;}</style>

13. Box Model


<style>div{border:2px solid;padding:20px;margin:20px;}</style>

14. Position
<style>h1{position:relative;left:50px;}</style>

15. Internal CSS


<style>h1{color:blue;}</style>

16. External CSS


[Link] links [Link]
[Link]: h1{color:green;text-align:center;}

You might also like