Lokesh HTML Tasks
Uploaded by
princekjoseph2005Lokesh HTML Tasks
Uploaded by
princekjoseph2005Program no:01
Tiitle: Create a webpage that includes a scrolling header message, a table displaying details of your
favorite movies (such as name, genre, year, and rating), an image of your favorite actor/actress, a
movie trailer video with controls, and an audio player for a movie soundtrack that auto-plays when
the page loads.
CODE:
<!DOCTYPE html>
<html>
<head>
<title>Movie Detalis</title>
</head>
<body>
<h1>Telugu Movies</h1>
<marquee direction="right" bgcolor="lightblue" width="50%"
height="30px">Action&Comedy</marquee>
<marquee direction="left" bgcolor="lightgreen" width="50%"
height="30px">Thriller</marquee>
</body>
<table border = "3">
<tr><th>S.no</th><th>Movie NameS</th><th>Hero Name</th><th>Heroine
Name</th></tr>
<tr><th>1</th><th>Jawan</th><th>Shah Rukh Khan</th><th>Nayanthara</th></tr>
<tr><th>2</th><th>War</th><th>Hrithik Roshan</th><th>Vaani kapoor</th></tr>
<tr><th>3</th><th>Shivalinga</th><th>Raghava Lawrence</th><th>Ritika Singh</th></tr>
<tr><th>4</th><th>Devara</th><th>NTR</th><th>Janhvi kapoor</th></tr>
<tr><th>5</th><th>Kanchana 2</th><th>Raghava Lawrence</th><th>Taapsee
Pannu</th></tr>
<tr><th>5</th><th>Salaar</th><th>Prabhas</th><th>Shruti Haasan</th></tr>
</table>
<img src="C:\Users\LOKESH\OneDrive\Pictures\download.jpeg"></br>
<video src="C:\Users\LOKESH\Downloads\Game Changer (2025) Telugu PREHD - x264 -
AAC - 700MB.mp4" height="150"width="400"controls></video></br>
<audio src="C:\Users\LOKESH\Downloads\saaho_bgm.mp3"controls></audio>
</head>
</html>
O/P:
Program no:02
Title: Design a webpage that includes a horizontal navigation menu with links to "Home," "About,"
"Services," and "Contact," followed by a section that displays a list of your favorite books in a neat
table with columns for Title, Author, and Genre. Below the table, insert an image of the book cover
for one of the books, a video review of the book, and an audio clip of an author interview.
Code:
<!DOCTYPE html>
<html>
<head>
<title>My Favorite books</title>
</head>
<body>
<h2>Navigation</h2>
<hr>
<a href="#">Home</a>|
<a href="#">About</a>|
<a href="#">Services</a>|
<a href="#">Contact</a>
</hr>
<h2>MY Favorite Books</h2>
<p>
<table border = "2">
<tr><th>Title</th><th>Author</th><th>Theme</th></tr>
<tr><th>Pirates of the caribbean</th><th>Jack Sparrow</th><th>Adventure</th></tr>
<tr><th>A story of struggle</th><th>Ashok Kumawat</th><th>Rich person</th></tr>
<tr><th>The jungle book</th><th>Rudyard kipling</th><th>Classic fiction</th></tr>
</table>
</p>
<h2>The jungle book-book cover</h2>
<img src="C:\Users\LOKESH\OneDrive\Pictures\images.jpeg"height="250">
<h2>Video Review</h2>
<iframe width="400" height="250" src="https://www.youtube.com/embed/yjQQdO6xxxQ?
si=YUowX_GBqa8gpwGm" title="YouTube video player" frameborder="0" allow="accelerometer;
autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
<h2>Author interview Audio</h2>
<audio src="C:\Users\LOKESH\Downloads\The Jungle Book Interviews_ Jon
Favreau.mp3"controls></audio>
</body>
Output:
Program no:03
Title:
Create a portfolio webpage with a header that scrolls a welcome message across the screen,
followed by a section that includes a table of your recent projects with columns for Project Name,
Description, and Date. Below the table, add an image of a screenshot from one of the projects, a
video tutorial on the project, and an audio description of the project.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Portfolio website</title>
</head>
<body>
<h1>Portfolio</h1>
<marquee direction="left" bgcolor="lightblue" width="60%" height="30px">Welcome
to My Portfolio! Explore my latest projects below.</marquee>
</body>
<table border = "2">
<tr><th>S.no</th><th>Project names</th><th>Discription</th><th>Date</th></tr>
<tr><th>1</th><th>Project Alpha</th><th>A web application for task
management</th><th>2025-05-10</th></tr>
<tr><th>2</th><th>Project Beta</th><th>A mobile app for fitness tracking.</th><th>2025-
04-15</th></tr>
<tr><th>3</th><th>Project gamma</th><th>An e-commerce platform for handmade
goods</th><th>2025-03-20</th></tr>
</table>
<img src="C:\Users\LOKESH\OneDrive\Pictures\project alpha.jpeg"><br>
<iframe width="560" height="315" src="https://www.youtube.com/embed/XobFfV1qKMY?
si=ejEeNKw12nuYHZPI" title="YouTube video player" frameborder="0" allow="accelerometer;
autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe><br>
<audio controls>
<source src="https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3"
type="audio/mpeg" />
</audio>
</html>
OutPut:
Project no:04
Title:Create a basic HTML page introducing yourself. Design a webpage using appropriate HTML
tags that displays:
Your full name as a heading
A short paragraph describing yourself
A list of your hobbies using an unordered list
Source code:
<!DOCTYPE html>
<html>
<head>
<title>Introduce yourself</title>
</head>
<body>
<h1>K.LOKESH</h1>
<p>Hello! My name is K.lokesh, and I am a web developer with a passion for crafting elegant
and functional websites.
I thrive on learning new technologies and finding innovative solutions to complex
challenges.</p>
<ul type="circle">
<li>Reading books</li>
</ul>
<ul type="square">
<li>Traveling to new places</li>
</ul>
<ul type="disc">
<li>Playing games</li>
</ul>
<ul type="none">
<li>Exploring nature</li>
</ul>
</body>
</html>
Output:
Project no:05
Title:
Create a simple resume web page using HTML. The resume should include
Source code:
<!DOCTYPE html>
<html>
<head>
<title>Introduce yourself</title>
</head>
<body>
<h1>K.LOKESH</h1>
<h2>BIO</h2>
<p>
My passion lies in creating user-friendly and visually appealing applications that solve real-
world problems.
I am continuously honing my skills to stay updated with the latest trends in technology.
</p>
<h2>Skills</h2>
<ul type="circle">
<li>Html,css</li>
</ul>
<ul type="square">
<li>C,C++</li>
</ul>
<ul type="disc">
<li>Database Management (MySQL, MongoDB)</li>
</ul>
<ul type="none">
<li>Orcale in mysql</li>
</ul>
<h2>Qualifications</h2>
<ol type="1"></ol>
<li>Bachelor of Science in Computers Aditya Degree College (Pursuing)</li>
<ol type="A"></ol>
<li>Introduction to Cyber Security</li>
<ol type="a"></ol>
<li>Basic knowledge of cybersecurity, network security, and practical experience with tools like
Wireshark.</li>
</body>
</html>
Output:
Program no:06
Title:
Create a paragraph demonstrating the following text formatting tags:
Source code:
<!DOCTYPE html>
<html>
<head>
<title>Paragraph webpage</title>
</head>
<body>
<h2>paragraph</h2>
<p>Growth strategies involve various approaches for a business <b>to increase its market
share,
revenue, and overall size</b>. <strong>Examples include market penetration, product
development,
market development, and diversification</strong>. <i>These strategies can be implemented
to increase existing market share</i>,
<em>enter new markets, or develop new products.</em>
<u>Market Penetration</u>: This involves increasing market<mark> share
within existing markets by improving product offerings,</mark>
<small> marketing, or pricing. For example,Facebook uses market penetration to retain its
market share.</small>
</p>
</body>
</html>
Output:
Program no:07
Title:
Create a nested list of a shopping category.
Source code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Shopping Categories</title>
</head>
<body>
<ul>
<li>Fruits
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Orange</li>
</ul>
</li>
<li>Vegetables
<ul>
<li>Carrot</li>
<li>Broccoli</li>
<li>Spinach</li>
</ul>
</li>
<li>Electronics
<ul>
<li>Smartphone</li>
<li>Tablet</li>
<li>Headphones</li>
</ul>
</li>
</ul>
</body>
</html>
Output:
Project no:08
Title :
Create an ordered list of your semester subjects.
Source Code :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Semester Subjects</title>
</head>
<body>
<h2>Semester Subjects</h2>
<ol type="I" start="4">
<li>Mathematics</li>
<li>Physics</li>
<li>Chemistry</li>
<li>Computer Science</li>
<li>English Literature</li>
</ol>
</body>
</html>
Output:
Program no:09
Title :
Create a student marks table using HTML table tags.
Source code:
<!DOCTYPE html>
<html>
<head>
<title>Student Marks Table</title>
</head>
<body>
<h2>Student Marks</h2>
<table border="1" cellpadding="8" cellspacing="0">
<thead>
<tr>
<th>Name</th>
<th>Subject</th>
<th>Marks</th>
<th>Grade</th>
</tr>
</thead>
<tbody>
<tr>
<td>lokesh</td>
<td>DBMS</td>
<td>63</td>
<td>A</td>
</tr>
<tr>
<td>JOseph</td>
<td>Programming C</td>
<td>59</td>
<td>B</td>
</tr>
<tr>
<td>MAneesh</td>
<td>Java</td>
<td>70</td>
<td>A+</td>
</tr>
<tr>
<td>Gnanendra</td>
<td>Cloud computing</td>
<td>60</td>
<td>A</td>
</tr>
</tbody>
</table>
</body>
</html>
Output:
Program no:10
Title:
Create a webpage that displays two images using the <img> tag.
Source code:
<!DOCTYPE html>
<html>
<head>
<title>Image Display</title>
</head>
<body>
<h2>Image Display Example</h2>
<div>
<img src="C:\Users\LOKESH\OneDrive\Pictures\Screenshots\download.jpeg" alt="Sample Image
300x300" width="300" height="300" />
</div>
<div>
<img src="C:\Users\LOKESH\OneDrive\Pictures\images.jpeg" alt="Sample Image 500x400"
width="500" height="400" />
</div>
</body>
</html>
Output:
Program no:11
Title : Create a multimedia demo page using HTML.
Source Code:
<!DOCTYPE html>
<html>
<head>
<meta>
<title>Multimedia Demo Page</title>
</head>
<body>
<h1>Multimedia Demo</h1>
<div class="media-container">
<h2>Video Example</h2>
<video width="640" height="360" controls>
<source src="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.webm"
type="video/webm" />
</video>
</div>
<div class="media-container">
<h2>Audio Example</h2>
<audio controls>
<source src="C:\Users\LOKESH\Downloads\saaho_bgm.mp3"type="audio/mpeg" />
</audio>
</div>
</body>
</html>
Output:
Program no:12
Title:Create a styled section using the <div> tag. The <div> should contain:
Source code:
<!DOCTYPE html>
<html>
<head>
<title>Styled Notification</title>
</head>
<body>
<div style="border: 2px solid #333; padding: 15px; width: 400px;">
<h2>Notification</h2>
<p>Your subscription is expiring soon.
Please renew it to continue enjoying our services without interruption.</p>
</div>
</body>
</html>
Output:
Program no:13
Title:
Create a scrolling marquee using the <marquee> tag.
Source code:
<!DOCTYPE html>
<html>
<head>
<title>Marquee Demo</title>
</head>
<body>
<h2>Scrolling Text Marquee</h2>
<marquee direction="right" scrollamount="6" style="font-size: 18px">
Welcome to the lokesh webpage!
</marquee>
<h2>Vertical Image Marquee</h2>
<marquee direction="up" scrollamount="4" style="height: 200px; width: 150px; border: 1px solid,
display: block; margin-top: 20px;">
<img src="C:\Users\LOKESH\OneDrive\Pictures\Screenshots\download.jpeg" alt="Scrolling Image"
width="150" height="150" />
</marquee>
</body>
</html>
Output:
Program no:14
Title:
Create a web page with a background image.
Source code:
<!DOCTYPE html>
<html>
<head>
<title>Background Image Page</title>
</head>
<body background="C:\Users\LOKESH\OneDrive\Pictures\temerario01.webp">
<p>This beautiful background image shows a serene forest with sun rays filtering through the trees,
creating a calm and peaceful atmosphere.</p>
</body>
</html>
Output:
Program no:15
Title :
Create a Student Registration Form Design a simple registration form with the following fields
Source code:
<!DOCTYPE html>
<html>
<head>
<h2>Student Registration Form</h2>
</head>
<form>
<label for="fullName">Full Name:</label><br>
<input type="text" id="fullName" name="fullName" required><br><br>
<label for="email">Email:</label><br>
<input type="email" id="email" name="email" required><br><br>
<label>Gender:</label><br>
<input type="radio" id="male" name="gender" value="male">
<label for="male">Male</label><br>
<input type="radio" id="female" name="gender" value="female">
<label for="female">Female</label><br>
<input type="radio" id="other" name="gender" value="other">
<label for="other">Other</label><br><br>
<label>Courses Interested:</label><br>
<input type="checkbox" id="c" name="course" value="C">
<label for="c">C</label><br>
<input type="checkbox" id="java" name="course" value="Java">
<label for="java">Java</label><br>
<input type="checkbox" id="python" name="course" value="Python">
<label for="python">Python</label><br>
<input type="checkbox" id="html" name="course" value="HTML">
<label for="html">HTML</label><br><br>
<label for="location">Location:</label><br>
<select id="location" name="location">
<option value="hyderabad">Hyderabad</option>
<option value="vizag">Vizag</option>
<option value="vijayawada">Vijayawada</option>
</select><br><br>
<label for="about">About Yourself:</label><br>
<textarea id="about" name="about" rows="4" cols="50" required></textarea><br><br>
<a href="#">Already registered? Click here to login</a>
</form>
</html>
Output:
Program no :16
Title:
Online Course Enrollment Page
Instructions: Create an online course enrollment page:
Source code:
<!DOCTYPE html>
<html>
<head>
<title>Online Course Enrollment</title>
</head>
<body>
<h1>Online Course Enrollment</h1>
<div class="intro">
<p>Welcome to our online course enrollment page! Fill out the form below to get started on
your learning journey.</p>
<img src="C:\Users\LOKESH\OneDrive\Pictures\why-online-learning-is-good-
1.jpg"alt="Online Learning" style="max: width 150px;; height: 200px;;">
</div>
<form>
<label for="studentName">Student Name:</label>
<input type="text" id="studentName" name="studentName" required>
<br>
<label for="age">Age:</label>
<input type="number" id="age" name="age" required>
<br>
<label for="course">Select Your Course:</label>
<select id="course" name="course">
<option value="web-development">Web Development</option>
<option value="data-science">Data Science</option>
<option value="graphic-design">Graphic Design</option>
<option value="cyber-security">Cyber Security</option>
</select>
<br>
<label>Choose Your Learning Mode:</label>
<input type="radio" id="online" name="learningMode" value="online">
<label for="online">Online</label>
<input type="radio" id="offline" name="learningMode" value="offline">
<label for="offline">Offline</label>
<input type="radio" id="hybrid" name="learningMode" value="hybrid">
<label for="hybrid">Hybrid</label>
<br>
<div class="terms">
<input type="checkbox" id="terms" name="terms" required>
<label for="terms">I agree to the terms and conditions</label>
</div>
<br>
<label for="comments">Additional Comments:</label>
<br>
<textarea id="comments" name="comments" rows="4"></textarea>
<br>
<button type="submit">Enroll Now</button>
</form>
</body>
</html>
Output:
Program no:17
Title:
Feedback Form for a Website Instructions: Create a feedback form that asks users:
Source Code:
<!DOCTYPE html>
<html>
<head>
<title>Feedback Form</title>
</head>
<body>
<h1>Feedback Form</h1>
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
<br>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<br>
<label>How did you hear about the website?</label><br>
<input type="radio" id="google" name="source" value="google">
<label for="google">Google</label>
<input type="radio" id="social-media" name="source" value="social-media">
<label for="social-media">Social Media</label>
<input type="radio" id="friend" name="source" value="friend">
<label for="friend">Friend</label>
<input type="radio" id="others" name="source" value="others">
<label for="others">Others</label>
<br>
<label>What did you like the most?</label><br>
<input type="checkbox" id="ui-design" name="like" value="ui-design">
<label for="ui-design">UI Design</label><br>
<input type="checkbox" id="speed" name="like" value="speed">
<label for="speed">Speed</label><br>
<input type="checkbox" id="content" name="like" value="content">
<label for="content">Content</label><br>
<input type="checkbox" id="responsiveness" name="like" value="responsiveness">
<label for="responsiveness">Responsiveness</label><br>
<br>
<label for="rating">Rate us:</label>
<select id="rating" name="rating">
<option value="1">1 Star</option>
<option value="2">2 Stars</option>
<option value="3">3 Stars</option>
<option value="4">4 Stars</option>
<option value="5">5 Stars</option>
</select>
<br>
<label for="message">Leave a message or comment:</label><br>
<textarea id="message" name="message" rows="4"></textarea>
<br>
<button type="submit">Submit Feedback</button>
</form>
<a href="index.html">Return to Homepage</a>
</body>
</html>
Output:
Program no:18
Title:
College Event Signup Page Instructions:
Design a form for a college tech fest.
Source code:
<!DOCTYPE html>
<html>
<head>
<title>College Event Signup</title>
</head>
<body>
<h1>Welcome to the College Tech Fest</h1>
<p style="text-align: center;">Join us for an exciting day of innovation, learning, and fun!</p>
<div style="text-align: center; margin-bottom: 20px;">
<iframe width="560" height="315" src="https://www.youtube.com/embed/n90gDPUUwLw?
si=wDPp5drBl9Pt5JHt" title="YouTube video player" frameborder="0" allow="accelerometer;
autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
<table border = "3">
<tr><th>Event</th><th>Timing</th></tr>
<tr><th>Coding challenge</th><th>10:00 AM-12:00 Pm</th></tr>
<tr><th>Robotics Workshop</th><th>12:30 pm-2;30 Pm</th></tr>
<tr><th>AI Seminar</th><th>3:00 PM - 4:30 PM</th></tr>
<tr><th>Gaming Tournament</th><th>5:00 PM - 7:00 PM</th></tr>
</table>
<form>
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
<br>
<label for="phone">Phone Number:</label>
<input type="tel" id="phone" name="phone" required>
<br>
<label for="department">Select Your Department:</label>
<select id="department" name="department">
<option value="cse">Computer Science</option>
<option value="ece">Electronics</option>
<option value="mech">Mechanical</option>
<option value="civil">Civil</option>
</select>
<br>
<label>Select the events you want to participate in:</label><br>
<input type="checkbox" id="coding" name="events" value="coding">
<label for="coding">Coding Challenge</label><br>
<input type="checkbox" id="robotics" name="events" value="robotics">
<label for="robotics">Robotics Workshop</label><br>
<input type="checkbox" id="ai" name="events" value="ai">
<label for="ai">AI Seminar</label><br>
<input type="checkbox" id="gaming" name="events" value="gaming">
<label for="gaming">Gaming Tournament</label>
<br>
<label for="experience">Share any past experience:</label><br>
<textarea id="experience" name="experience" rows="4"></textarea>
<br>
<button type="submit">Register</button>
</form>
<a href="event-details.html">View Full Event Details</a>
</body>
</html>
OUTPUT:
Program no:19
Title:
Job Application Form
Source code:
<!DOCTYPE html>
<html>
<head>
<title>Job Application Form</title>
</head>
<body>
<div class="container">
<h1 class="heading">Job Application Form</h1>
<p class="description">Welcome to DareDevil Corporation, a leading technology company
that specializes in software development and innovation. We are committed to providing our
customers with the best solutions and services. If you are passionate about technology and want
to join our team, please fill out the application form below.</p>
<form>
<div class="form-group">
<label for="name">Applicant Name:</label><br>
<input type="text" id="name" name="name" required>
</div>
<div class="form-group">
<label for="email">Email ID:</label><br>
<input type="email" id="email" name="email" required>
</div>
<div class="form-group">
<label for="job-role">Choose preferred job role:</label><br>
<select id="job-role" name="job-role" required>
<option value="">Select a role</option>
<option value="Backend">Backend</option>
<option value="Frontend">Frontend</option>
<option value="Full Stack">Full Stack</option>
</select>
</div>
<div class="form-group">
<label for="skills">Skills:</label><br>
<div class="skills">
<label><input type="checkbox" name="skills" value="HTML"> HTML</label><br>
<label><input type="checkbox" name="skills" value="CSS"> CSS</label><br>
<label><input type="checkbox" name="skills" value="Python"> Python</label><br>
<label><input type="checkbox" name="skills" value="Java"> Java</label><br>
</div>
</div>
<div class="form-group"><br>
<label for="resume">Upload Resume:</label>
<input type="file" id="resume" name="resume" required>
</div>
<div class="form-group"><br>
<label for="why-this-job">Why do you want this job?:</label><br>
<textarea id="why-this-job" name="why-this-job" required></textarea>
</div>
<button class="submit-btn" type="submit">Submit Application</button><br>
</form>
<p class="visit-link"><a href="https://www.example.com/company-page">Visit our company
page</a></p>
</div>
</body>
</html>
Output:
Program no:20
Title:
Create a personal website homepage that includes:
Source code:
<!DOCTYPE html>
<html>
<head>
<title>K.LOKESH - Personal Website</title>
</head>
<body>
<!-- Top Section with Name and Navigation Links -->
<header>
<h1>K.LOKESH</h1>
<nav>
<a href="home.html">Home</a> |
<a href="projects.html">Projects</a> |
<a href="contact.html">Contact</a>
</nav>
</header>
<hr>
<!-- Short Background Paragraph -->
<section>
<h2>About Me</h2>
<p>
Hello! I'm K.lokesh, a passionate Computer Science student currently pursuing my BSc in
Computers from Aditya Degree College.
I have a keen interest in web development, network security, and data analysis. With
experience in HTML, CSS, Python, and cybersecurity tools like Wireshark,
I'm always eager to learn new technologies and take on exciting projects.
</p>
</section>
</body>
</html>
Output:
Program no:21
Title:
Design a layout with two vertical panels:
Code:
<!DOCTYPE html>
<html>
<head>
<title>Two Vertical Panels</title>
</head>
<body>
<div class="panel">
<iframe src="https://www.example.com" title="Left Panel"></iframe>
</div>
<div class="panel">
<iframe src="https://www.wikipedia.org" title="Right Panel"></iframe>
</div>
</body>
</html>
Output:
Program no:22
Title:
Build a form for event registration where
CODE:
<!DOCTYPE html>
<html>
<head>
<title>Event Registration Form</title>
<script>
function confirmRegistration() {
alert("Thank you for registering! We have received your details.");
</script>
</head>
<body>
<h1>Event Registration Form</h1>
<form>
<!-- Full Name -->
<label for="fullname">Full Name:</label><br>
<input type="text" id="fullname" name="fullname" required><br><br>
<!-- Email -->
<label for="email">Email:</label><br>
<input type="email" id="email" name="email" required><br><br>
<!-- Phone Number -->
<label for="phone">Phone Number:</label><br>
<input type="tel" id="phone" name="phone" required><br><br>
<!-- Gender -->
<label>Gender:</label><br>
<input type="radio" id="male" name="gender" value="Male">
<label for="male">Male</label><br>
<input type="radio" id="female" name="gender" value="Female">
<label for="female">Female</label><br>
<input type="radio" id="other" name="gender" value="Other">
<label for="other">Other</label><br><br>
<!-- Interests -->
<label>Interests:</label><br>
<input type="checkbox" id="music" name="interests" value="Music">
<label for="music">Music</label><br>
<input type="checkbox" id="sports" name="interests" value="Sports">
<label for="sports">Sports</label><br>
<input type="checkbox" id="art" name="interests" value="Art">
<label for="art">Art</label><br><br>
<!-- City Dropdown -->
<label for="city">Select Your City:</label><br>
<select id="city" name="city">
<option value="Visakhapatnam">Visakhapatnam</option>
<option value="Hyderabad">Hyderabad</option>
<option value="Vijayawada">Vijayawada</option>
<option value="Other">Other</option>
</select><br><br>
<!-- Comments -->
<label for="comments">Additional Comments:</label><br>
<textarea id="comments" name="comments" rows="5" cols="40" placeholder="Write
here..."></textarea><br><br>
<!-- Buttons -->
<input type="submit" value="Submit">
<input type="reset" value="Reset">
<button type="button" onclick="confirmRegistration()">Confirm</button>
</form>
</body>
</html>
OUTPUT:
Program no:23
Title:
Create a single webpage layout that includes:
Code:
<!DOCTYPE html>
<html>
<head>
<title>News and Tips Layout</title>
</head>
<body>
<main>
<section class="news" aria-label="Today's news">
<h2>Breaking News: Global Climate Initiatives Gain Momentum</h2>
<p>World leaders have come together to pledge stronger commitments towards reducing
carbon emissions. Experts praise this collaborative effort as a major step in combating climate
change, with new policies aiming for a sustainable future.</p>
</section>
<section class="ads" aria-label="Tips and advertisements">
<h3>Tips & Ads</h3>
<ul>
<li>Tip: Reduce plastic use by switching to reusable containers.</li>
<li>Ad: Discover eco-friendly gadgets at GreenTech Store.</li>
<li>Tip: Save water by fixing leaks promptly.</li>
<li>Ad: Join the upcoming Virtual Sustainability Conference.</li>
</ul>
</section>
</main>
<footer>
<div>Author: LOKESH</div>
<div>© <span id="year"></span></div>
<div>Contact: <a href="mailto:[email protected]">[email protected]</a></div>
</footer>
<script>
// Set current year dynamically
document.getElementById('year').textContent = new Date().getFullYear();
</script>
</body>
</html>
Output:
Program no:24
Title:
Build a payment selection form that groups options like UPI, Credit Card, and Cash on Delivery
under one box.
CODE:
<!DOCTYPE html>
<html>
<head>
<title>Payment Selection Form</title>
</head>
<body>
<h1>Payment Selection</h1>
<form>
<!-- Payment Method Section -->
<fieldset>
<legend>Payment Method</legend>
<input type="radio" id="upi" name="payment" value="UPI">
<label for="upi">UPI</label><br>
<input type="radio" id="creditcard" name="payment" value="Credit Card">
<label for="creditcard">Credit Card</label><br>
<input type="radio" id="cod" name="payment" value="Cash on Delivery">
<label for="cod">Cash on Delivery</label><br>
</fieldset>
<br>
<!-- Submit Button -->
<input type="submit" value="Proceed to Pay">
</form>
</body>
</html>
Output:
Program no:25
Title:
Display a product offer where:
Code:
<!DOCTYPE html>
<html>
<head>
<title>Product Offer</title>
</head>
<body>
<div class="offer-container">
<div class="original-price">$149.99</div>
<div class="discounted-price">$99.99</div>
<div class="note" title="This offering includes new features!">New features included</div>
</div>
</body>
</html>
OUTPUT:
Program no:26
TITLE:
Design a layout for a blog with:
Code:
<!DOCTYPE html>
<html>
<head>
<title>My Travel Blog</title>
</head>
<body>
<!-- Title and Navigation Menu -->
<header>
<h1>lokesh's Travel Blog</h1>
<nav>
<a href="#">Home</a> |
<a href="#">Destinations</a> |
<a href="#">Travel Tips</a> |
<a href="#">Contact</a>
</nav>
<hr>
</header>
<!-- Main Content and Sidebar Layout -->
<section style="display: flex;">
<!-- Main Article Section -->
<article style="flex: 70%; padding: 10px;">
<h2>My Trip to Araku Valley</h2>
<p>
Last summer, I took an unforgettable trip to Araku Valley, a scenic hill station in Andhra
Pradesh.
The lush green valleys, winding roads, and waterfalls made the journey truly magical. I
visited Borra Caves,
tried delicious bamboo chicken, and enjoyed a peaceful train ride through tunnels and
bridges. It was an
experience filled with nature, adventure, and cultural richness.
</p>
</article>
<!-- Sidebar Section -->
<aside style="flex: 30%; padding: 10px; background-color: #f0f0f0;">
<h3>Travel Tips</h3>
<ul>
<li>Always carry a water bottle and basic first aid.</li>
<li>Check weather forecasts before your trip.</li>
<li>Keep digital copies of your travel documents.</li>
<li>Interact with locals for hidden gems and food spots!</li>
</ul>
</aside>
</section>
<hr>
<!-- Footer Section -->
<footer style="text-align: center;">
<p>Contact: [email protected]</p>
<p>© 2025 K.lokesh. All rights reserved.</p>
</footer>
</body>
</html>
OUTPUT:
Program no :27
Title:
Simulate a science or math article:
CODE:
<!DOCTYPE html>
<html>
<head>
<title>Science and Math Article</title>
</head>
<body>
<h1>Exploring Chemistry and Mathematics</h1>
<p>The chemical formula for water is <span class="formula">H<sub>2</sub>O</span>. This
represents two hydrogen atoms bonded to one oxygen atom, forming a vital compound for life as
we know it.</p>
<p>In mathematics, the square of a number <span class="math">x</span> is denoted as <span
class="math">x<sup>2</sup></span>. This represents multiplying the number by itself: <span
class="math">x × x</span>.</p>
<blockquote>
“Imagination is more important than knowledge. Knowledge is limited. Imagination encircles the
world.”
<footer>— Albert Einstein</footer>
</blockquote>
</body>
</html>
OUTPUT:
Program no:28
Title:
Create a support form:
HTML Code:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Support Form</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="form-container">
<form action="#" method="post">
<div class="delivery-info">
<h2>Delivery Info</h2>
<div class="form-group">
<label for="fullName">Full Name:</label>
<input type="text" id="fullName" name="fullName" required>
</div>
<div class="form-group">
<label for="mobileNumber">Mobile Number:</label>
<input type="tel" id="mobileNumber" name="mobileNumber" required>
</div>
<div class="form-group">
<label for="address">Address:</label>
<textarea id="address" name="address" rows="4" required></textarea>
</div>
</div>
<button type="submit" class="submit-btn">Submit</button>
</form>
</div>
</body>
</html>
CSS Code:
/* styles.css */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background-color: #f9f9f9;
.form-container {
width: 90%;
max-width: 400px;
background-color: #ffffff;
padding: 20px;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
h2 {
margin-bottom: 15px;
font-size: 1.5em;
color: #333333;
.delivery-info {
border: 1px solid #dddddd;
padding: 15px;
border-radius: 8px;
background-color: #fafafa;
margin-bottom: 20px;
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
margin-bottom: 5px;
font-size: 0.9em;
color: #555555;
.form-group input,
.form-group textarea {
width: 100%;
padding: 10px;
border: 1px solid #cccccc;
border-radius: 5px;
font-size: 1em;
box-sizing: border-box;
.submit-btn {
width: 100%;
padding: 10px;
font-size: 1em;
color: #ffffff;
background-color: #007bff;
border: none;
border-radius: 5px;
cursor: pointer;
.submit-btn:hover {
background-color: #0056b3;
Output:
Program no:29
Title:
Develop a mini photo gallery:
Html code:
<!DOCTYPE html>
<html>
<head>
<title>My Favorite Place Photo Gallery</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f9f9f9;
color: #333;
.gallery-container {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background-color: #fff;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
border-radius: 10px;
h1 {
text-align: center;
font-size: 2rem;
margin-bottom: 20px;
color: #007BFF;
.gallery {
display: flex;
flex-direction: column;
gap: 20px;
.gallery-item {
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid #ddd;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
.gallery-item img {
width: 100%;
height: auto;
.gallery-item caption {
padding: 10px;
font-size: 1rem;
color: #555;
background-color: #f1f1f1;
width: 100%;
text-align: center;
</style>
</head>
<body>
<div class="gallery-container">
<h1>My Favorite Place Photo Gallery</h1>
<div class="gallery">
<div class="gallery-item">
<img src="images (1).jpg.jpg" alt="Beautiful Mountain View">
<caption>A breathtaking view of the mountains during sunrise.</caption>
</div>
<div class="gallery-item">
<img src="lake.jpg.jpeg" alt="Serene Lake">
<caption>A serene lake surrounded by lush greenery.</caption>
</div>
</div>
</div>
</body>
</html>
Output:
Program no;30
Title:
Create a Layout Using Universal and Type Selectors
Code:
<!DOCTYPE html>
<html>
<head>
<title>Universal and Type Selectors Layout</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<h1>Welcome to My Website</h1>
</header>
<div class="content">
<p>This is a simple webpage layout styled using universal and type selectors in CSS. The
universal selector ensures consistent base styles for all elements, while type selectors style specific
elements like headings, paragraphs, and lists.</p>
<ul>
<li>Consistent margins and padding</li>
<li>Common font family and line height</li>
<li>Clean and responsive design</li>
</ul>
<p>Feel free to explore and modify the code to better understand the principles of CSS
selectors.</p>
</div>
<footer>
<p>© 2025 My Website | All rights reserved.</p>
</footer>
</body>
</html>
Output:
Program no:31
Title:
Create a Login Form Using the <fieldset> and <legend> Tags
Html code:
<!DOCTYPE html>
<html>
<head>
<title>Login Form</title>
</head>
<body>
<form>
<fieldset>
<legend>Login Details</legend>
<label for="username">Username:</label>
<input type="text" id="username" name="username" required>
<br><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password" required>
<br><br>
<button type="submit">Login</button>
</fieldset>
</form>
</body>
</html>
Output:
Program no:32
Title:
Style Elements Using Class and ID Selectors
Code:
<!DOCTYPE html>
<html>
<head>
<title>Class and ID Styling</title>
<style>
/* ID Selector */
#main-title {
color: #4CAF50;
text-align: center;
font-family: 'Arial', sans-serif;
font-size: 2rem;
margin-bottom: 20px;
/* Class Selector */
.highlight {
background-color: #f9f9f9;
padding: 15px;
border-left: 4px solid #4CAF50;
margin-bottom: 10px;
font-family: 'Georgia', serif;
</style>
</head>
<body>
<h1 id="main-title">Welcome to My Webpage</h1>
<p>This is the first paragraph, providing an introduction to the page content.</p>
<p class="highlight">This paragraph is highlighted with a unique background color and
padding.</p>
<p class="highlight">Another highlighted paragraph demonstrating the use of a class.</p>
</body>
</html>
Output:
Program no:33
Title:
Design a timetable using css
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Timetable Design</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
background-color: #f4f4f9;
color: #333;
.timetable {
width: 100%;
max-width: 800px;
margin: 0 auto;
border-collapse: collapse;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
.timetable th, .timetable td {
border: 1px solid #ddd;
text-align: center;
padding: 10px;
.timetable th {
background-color: #4CAF50;
color: white;
font-size: 1rem;
.timetable tr:nth-child(even) {
background-color: #f9f9f9;
.timetable tr:hover {
background-color: #f1f1f1;
.time-slot {
font-weight: bold;
background-color: #dff0d8;
caption {
font-size: 1.5rem;
margin-bottom: 10px;
font-weight: bold;
</style>
</head>
<body>
<table class="timetable">
<caption>Weekly Timetable</caption>
<thead>
<tr>
<th>Time</th>
<th>Monday</th>
<th>Tuesday</th>
<th>Wednesday</th>
<th>Thursday</th>
<th>Friday</th>
</tr>
</thead>
<tbody>
<tr>
<td class="time-slot">9:00 - 10:00 AM</td>
<td>Mathematics</td>
<td>Science</td>
<td>English</td>
<td>History</td>
<td>Geography</td>
</tr>
<tr>
<td class="time-slot">10:00 - 11:00 AM</td>
<td>Physics</td>
<td>Mathematics</td>
<td>Biology</td>
<td>Computer Science</td>
<td>English</td>
</tr>
<tr>
<td class="time-slot">11:00 - 12:00 PM</td>
<td>History</td>
<td>Geography</td>
<td>Mathematics</td>
<td>Science</td>
<td>Physics</td>
</tr>
<tr>
<td class="time-slot">1:00 - 2:00 PM</td>
<td>English</td>
<td>Biology</td>
<td>Computer Science</td>
<td>Physics</td>
<td>Mathematics</td>
</tr>
<tr>
<td class="time-slot">2:00 - 3:00 PM</td>
<td>Science</td>
<td>History</td>
<td>Geography</td>
<td>Mathematics</td>
<td>Biology</td>
</tr>
</tbody>
</table>
</body>
</html>
Output:
Program no:34
Title:
Create a webpage where you style multiple elements using a class selector.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Class Selector Styling</title>
<style>
/* Class Selector */
.blue-text {
color: blue;
font-size: 18px;
font-family: Arial, sans-serif;
</style>
</head>
<body>
<h1 class="blue-text">Welcome to the Styled Webpage</h1>
<p class="blue-text">This is a paragraph styled using the class selector.</p>
<p class="blue-text">Another paragraph sharing the same styling.</p>
<ul>
<li class="blue-text">Styled list item 1</li>
<li class="blue-text">Styled list item 2</li>
</ul>
</body>
</html>
Output:
Program no:35
Title:
Define a class selector that changes the background color of the elements to lightgray.
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Class Selector Styling</title>
<style>
/* Class Selector */
.blue-text {
color: blue;
font-size: 18px;
font-family: Arial, sans-serif;
.lightgray-bg {
background-color: lightgray;
font-family: Arial, sans-serif;
padding: 10px;
}
</style>
</head>
<body>
<h1 class="blue-text lightgray-bg">Welcome to the Styled Webpage</h1>
<p class="blue-text">This is a paragraph styled using the class selector.</p>
<p class="blue-text lightgray-bg">Another paragraph sharing the same styling and
background.</p>
<ul>
<li class="blue-text">Styled list item 1</li>
<li class="blue-text">Styled list item 2</li>
</ul>
</body>
</html>
Output:
Program no:36
Title:
Use a class selector to style elements with the following properties
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Class Selector Styling</title>
<style>
/* Class Selector */
.blue-text {
color: blue;
font-size: 18px;
font-family: Arial, sans-serif;
.lightgray-bg {
background-color: lightgray;
font-family: Arial, sans-serif;
padding: 10px;
.bordered {
border: 2px solid black;
width: 200px;
height: 100px;
</style>
</head>
<body>
<h1 class="blue-text lightgray-bg bordered">Welcome to the Styled Webpage</h1>
<p class="blue-text bordered">This is a paragraph styled using the class selector.</p>
<p class="blue-text lightgray-bg">Another paragraph sharing the same styling and
background.</p>
<ul>
<li class="blue-text">Styled list item 1</li>
<li class="blue-text">Styled list item 2</li>
</ul>
</body>
</html>
Output:
Program no:37
Title:
Welcome Section Design
Q: Design a webpage section with a large main title and a brief introduction below it.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Welcome Section Design</title>
<style>
/* Reset default spacing */
*{
margin: 0;
padding: 0;
box-sizing: border-box;
/* Type Selector for Main Title */
h1 {
font-weight: bold;
text-align: center;
font-size: 2.5rem;
margin: 20px 0;
/* Type Selector for Introduction Text */
p{
text-align: left;
line-height: 1.6;
font-size: 1rem;
margin: 10px 20px;
font-family: Arial, sans-serif;
</style>
</head>
<body>
<h1>Welcome to Our Website</h1>
<p>This section provides an introduction to the website. The text is left-aligned with increased
line spacing to enhance readability. Explore our features and content to learn more about what we
offer.</p>
</body>
</html>
Output:
Program no:38
Title:
Product Showcase
Question:
Create a card showcasing a product with an image, a product name, a brief description, and a
clickable button for purchase.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Product Showcase</title>
<style>
/* Reset default spacing */
*{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: Arial, sans-serif;
/* Type Selector for Main Title */
h1 {
font-weight: bold;
text-align: center;
font-size: 2.5rem;
margin: 20px 0;
/* Card Container */
.product-card {
width: 300px;
margin: 20px auto;
border: 1px solid #ccc;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
overflow: hidden;
text-align: center;
background-color: #fff;
/* Type Selector for Product Name */
.product-card h2 {
font-size: 1.5rem;
font-weight: bold;
margin: 15px 0;
}
/* Type Selector for Description */
.product-card p {
font-size: 1rem;
line-height: 1.6;
background-color: #f9f9f9;
padding: 10px;
/* Class Selector for Button */
.purchase-button {
display: inline-block;
margin: 15px 0;
padding: 10px 20px;
font-size: 1rem;
color: #fff;
background-color: #4CAF50;
border: none;
border-radius: 5px;
cursor: pointer;
text-decoration: none;
/* Hover Effect for Button */
.purchase-button:hover {
background-color: #45a049;
</style>
</head>
<body>
<h1>Product Showcase</h1>
<div class="product-card">
<img src="redmagic.jpg.jpg" alt="red magic" style="width: 100%;">
<h2>Product Name</h2>
<p>This is a brief description of the product. It highlights the features and benefits of the
product to attract potential buyers.</p>
<a href="#" class="purchase-button">Buy Now</a>
</div>
</body>
</html>
Output:
Program no:39
Title:
Navigation Bar
Question:
Build a horizontal navigation bar with multiple clickable menu options.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Navigation Bar</title>
<style>
*{
margin: 0;
padding: 0;
box-sizing: border-box;
nav {
background-color: #333;
display: flex;
justify-content: center;
padding: 10px;
nav a {
text-decoration: none;
color: white;
padding: 10px 20px;
font-size: 18px;
transition: background-color 0.3s, color 0.3s;
.active {
background-color: #007BFF;
color: white;
border-radius: 5px;
}
nav a:hover {
background-color: #555;
color: #fff;
</style>
</head>
<body>
<nav>
<a href="#" class="active">Home</a>
<a href="#about">About</a>
<a href="#services">Services</a>
<a href="#portfolio">Portfolio</a>
<a href="#contact">Contact</a>
</nav>
</body>
</html>
Output:
Program no:40
Title:
User Profile Card
Question:
Design a card featuring a user’s profile picture, name, and a short bio.
Code:
<!DOCTYPE html>
<html>
<head>
<title>User Profile Card</title>
<style>
*{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: Arial, sans-serif;
.profile-card {
width: 300px;
border: 1px solid #ddd;
border-radius: 10px;
padding: 20px;
text-align: center;
background-color: #f9f9f9;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
.profile-card img {
width: 100px;
height: 100px;
border-radius: 50%;
margin-bottom: 15px;
.profile-card h2 {
font-size: 24px;
margin-bottom: 10px;
color: #333;
}
.profile-card p {
font-size: 14px;
color: #666;
margin-bottom: 20px;
.profile-card .btn {
padding: 10px 20px;
font-size: 16px;
color: #fff;
background-color: #007BFF;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s;
.profile-card .btn:hover {
background-color: #0056b3;
</style>
</head>
<body>
<div class="profile-card">
<img src="pickachu.jpg.jpg" alt="pickachu Picture">
<h2>pickachu</h2>
<p>A passionate web developer who loves creating beautiful and functional designs.</p>
<button class="btn">Follow</button>
</div>
</body>
</html>
Output:
Program no:41
Title:
Blog Layout
Question:
Design a blog layout with a main title, multiple blog posts with a title and description, and a side
section for additional information.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Blog Layout</title>
<style>
*{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: Arial, sans-serif;
.container {
display: flex;
flex-wrap: wrap;
padding: 20px;
.main-title {
text-align: center;
font-size: 36px;
font-weight: bold;
margin-bottom: 20px;
width: 100%;
.blog-posts {
flex: 3;
padding: 20px;
.blog-post {
margin-bottom: 20px;
border-bottom: 1px solid #ddd;
padding-bottom: 10px;
.blog-post h3 {
font-size: 24px;
font-weight: bold;
color: #333;
}
.blog-post p {
font-size: 16px;
color: #555;
.sidebar {
flex: 1;
background-color: #f4f4f4;
padding: 20px;
border-left: 1px solid #ddd;
.sidebar h4 {
font-size: 20px;
font-weight: bold;
margin-bottom: 10px;
.sidebar p {
font-size: 14px;
color: #555;
</style>
</head>
<body>
<div class="main-title">Welcome to My Blog</div>
<div class="container">
<div class="blog-posts">
<div class="blog-post">
<h3>Blog Post Title 1</h3>
<p>This is the description for the first blog post. It provides a brief overview of the
content.</p>
</div>
<div class="blog-post">
<h3>Blog Post Title 2</h3>
<p>This is the description for the second blog post. It provides a brief overview of the
content.</p>
</div>
<div class="blog-post">
<h3>Blog Post Title 3</h3>
<p>This is the description for the third blog post. It provides a brief overview of the
content.</p>
</div>
</div>
<div class="sidebar">
<h4>About the Blog</h4>
<p>This section contains additional information, such as the blog's purpose or a short bio of
the author.</p>
</div>
</div>
</body>
</html>
Output:
You might also like
- Peter Stockwell-Texture - A Cognitive Aesthetics of Reading-Edinburgh University Press (2005)100% (1)Peter Stockwell-Texture - A Cognitive Aesthetics of Reading-Edinburgh University Press (2005)225 pages
- Instruction Manual 862 Interface-Thermo-Element100% (1)Instruction Manual 862 Interface-Thermo-Element16 pages
- WNL Move Over McDonalds French Taco Poised For Global Expansion AdvNo ratings yetWNL Move Over McDonalds French Taco Poised For Global Expansion Adv5 pages
- Focus2 2E Unit Test Vocabulary Grammar UoE Unit5 GroupB100% (1)Focus2 2E Unit Test Vocabulary Grammar UoE Unit5 GroupB2 pages
- Web Technologies Lab Manual R09 BY BHAVSINGH MALOTHNo ratings yetWeb Technologies Lab Manual R09 BY BHAVSINGH MALOTH47 pages
- Infographic PDF About Teaching Strategies To English SkillsNo ratings yetInfographic PDF About Teaching Strategies To English Skills2 pages
- Written Assignment Unit 3 Web ProgrammingNo ratings yetWritten Assignment Unit 3 Web Programming19 pages
- Cambridge Checkpoint Science Student's Book 1 Riley Peter Download100% (2)Cambridge Checkpoint Science Student's Book 1 Riley Peter Download31 pages
- How Does A Teacher Become A Facilitator of LearningNo ratings yetHow Does A Teacher Become A Facilitator of Learning32 pages
- 1 Teaching Assign Trinity in Asian ContextsNo ratings yet1 Teaching Assign Trinity in Asian Contexts6 pages
- MS Excel Full Notes PDF Free Download - Google SearchNo ratings yetMS Excel Full Notes PDF Free Download - Google Search3 pages
- Practical File, Dikshant Class 10th AlphaNo ratings yetPractical File, Dikshant Class 10th Alpha35 pages