2024-25

Acropolis Institute of
Technology and
Research, Indore Department of CSE
Submitted To: Prof. Sumit Jain
(Artificial Intelligence & Machine
Learning)

Internet and Web Technology (AL703D)

Submitted By:
Shwet Pardhi
Enrollment No. : 0827AL211039
Class/Year/Sem : ALML/4th/ 7th

[LAB ASSIGNMENT IWT (AL-703D)]

T h e O b j e c t i v e o f t h i s l a b o r a t o r y w o r k i s t o e n l i g h t e n t h e s t u d e n t w i t h k n o w l e d g e b a s e i nb
a s i c s i n v o l v e d i n p u b l i s h i n g c o n t e n t o n t h e W o r l d W i d e W e b . T h i s w i l l a l s o e x p o s es t
ud e n ts to the basi c too ls an d app lic at ion s u sed in We b pub lish ing .
 ACROPOLIS INSTITUTE OF TECHNOLOGY & RESEARCH,
INDORE

Department of CSE (Artificial Intelligence & Machine Learning)

CERTIFICATE

This is to certify that the experimental work entered in this journal as per

the B. TECH. IV year syllabus prescribed by the RGPV was done by Mr.

Shwet Pardhi B.TECH IV year VII semester in the Internet and Web

Technology Laboratory of this institute during the academic year 2024-

2025.

Signature of the Faculty

 About the Laboratory

This course is intended to teach the basics involved in publishing content on the World Wide Web.
This includes the ‘language of the Web’ – HTML, the fundamentals of how the Internet and the
Web function, a basic understanding of graphic production with a specific stress on creatinggraphics
for the Web, and a general grounding introduction to more advanced topics such asprogramming
and scripting. This will also expose students to the basic tools and applications used inWeb publishing.

In this lab, students will be able to learn and practice design and implement static and dynamic
website. Students can expand their skill set by learning how to design and implement dynamic
websites with good aesthetic sense of designing and latest technical know-how's. The aim of this Lab
is to provide you the conceptual and technological developments in the field of Internet andweb
designing with the emphasis on comprehensive knowledge of Internet and Web development
technologies like HTML, XML, CSS, PHP, XHTML, Java Script and Database. The World Wide
Web with its widespread usefulness has become an integral part of the Internet. Therefore, this course
also puts emphasis on basic concepts of web design.
❖ GENERAL INSTRUCTIONS FOR LABORATORY CLASSES

➢ DO’S

✓ Without Prior permission do not enter into the Laboratory.

✓ While entering into the LAB students should wear their ID cards.

✓ The Students should come with proper uniform.

✓ Students should sign in the LOGIN REGISTER before entering into the
laboratory.

✓ Students should come with observation and record note book to the laboratory.

✓ Students should maintain silence inside the laboratory.

✓ After completing the laboratory exercise, make sure to shutdown the system
properly.

➢ DONT’S

✓ Students bringing the bags inside the laboratory.

✓ Students using the computers in an improper way.

✓ Students scribbling on the desk and mishandling the chairs.

✓ Students using mobile phones inside the laboratory.

✓ Students making noise inside the laboratory.

 SYLLABUS
Course: AL703D (Internet and Web Technology)
Branch/Year/Sem: Artificial Intelligence & Machine Learning / IV / VII

Module1: Introduction: Concept of WWW, Internet and WWW, HTTP Protocol: Request and
Response, Web browser and Web servers, Features of Web 2.0 Web Design: Concepts of effective
web design, Web design issues including Browser, Bandwidth and Cache, Display resolution, Look
and Feel of the Website, Page Layout and linking, User centric design, Sitemap, Planning and
publishing website, Designing effective navigation.

Module2: HTML: Basics of HTML, formatting and fonts, commenting code, color, hyperlink, lists,
tables, images, forms, XHTML, Meta tags, Character entities, frames and frame sets, Browser
architecture and Web site structure. Overview and features of HTML5

Module3: Control Style sheets : Need for CSS, introduction to CSS, basic syntax and structure, using
CSS, background images, colors and properties, manipulating texts, using fonts, borders and boxes,
margins, padding lists, positioning using CSS, CSS2, Overview and features ofCSS3JavaScript :
Client side scripting with JavaScript, variables, functions, conditions, loops and repetition, Pop up
boxes, Advance JavaScript: Java script and objects, JavaScript own objects, the DOM and web
browser environments, Manipulation using DOM, forms and validations, DHTML : Combining
HTML, CSS and JavaScript, Events and buttons.

Module4: Introduction to XML, uses of XML, simple XML, XML key components, DTD and
Schemas, Using XML with application. Transforming XML using XSL and XSLT PHP: Introduction
and basic syntax of PHP, decision and looping with examples, PHP and HTML, Arrays, Functions,
Browser control and detection, string, Form processing, Files, Advance Features: Cookies and
Sessions, Object Oriented Programming with PHP.

Module5: Modules PHP and My SQL: Basic commands with PHP examples, Connection to server,
creating database, selecting a database, listing database, listing table names, creating a table,inserting
data, altering tables, queries, deleting database, deleting data and tables, PHP my admin and database
bugs.
HARDWARE AND SOFTWARE REQUIREMENTS:

S. Name of Item Specification

No.
1 Computer System Hard Disk min 5 GB
RAM: 4 GB / 8 GB
Processor: Intel i3 or above

S. Name of Item Specification

No.
1 Operating system Window XP or 2000
Editor Notepad++, VS Code, Edit++, or any

RATIONALE:
The purpose of this subject is to cover the concepts of Web Technologies in terms of Theory and
Implementation .The syllabus provides all the essential concepts of Web Technologies.

COURSE OBJECTIVES AND OUTCOMES

➢ Course Objectives
1. To comprehend the basics of the internet and web terminologies.
2. To introduce scripting language concepts for developing client-side applications.
3. To practice server-side programming features – PHP, JSP.
4. To build dynamic web pages with validation using Java Script objects and by applying
different event handling mechanisms.
5. To develop modern interactive web applications using PHP, XML and MySQL.

➢ Course Outcomes
At the end of the course student will be able to:
1. Understand Web design and concepts of Web design.
2. Analyze a web page and identify its elements and attributes.
3. Create web pages using XHTML and Cascading Style Sheets.
4. Build dynamic web pages using Java Script (Client-side programming).
5. Create XML documents and Schemas.
 Index
Date of Page Date of Grade &
S.No Exp. Name of the Experiment No. Submission Sign of the
Faculty
1 Create a table in HTML to the following details

9-10

Create a job application form

2
• Create an area called section one and place text boxes
that receives details –
a) Name b) Age c) Gender d) High School
e) Qualifications 11-13
• Create an area called section two and place text boxes
that receives details -
a) Previous Employment b) References
c) Qualification
• At the end place a submit button
3 Create a web page multiple types of style sheet used in a
single page. 14-15

4 16-17
Write a Java Script program by using variables.

5 18-20
Write a java script program on Form Validations.

Create an XML document template to describe the result of

6 students in an examination. The description should include the
student’s roll number, name, three subject names and marks,
21-22
total marks, percentage and results.
7 Design a digital calculator using HTML and Java script.
23-25
Create a web page with the following constrains
8 I) an clickable image ii) a hyperlink to your collage web site
26-27
Prepare a "resume.html" that might include such information as:
9 a) distinguishing marks b) special interests c) work history d) 28-30
education and training e) job objective f) relevant
skills and experience
Create a an HTML document with JavaScript code that
10 a) Has three textboxes and a button
b) The details to be accepted using textboxes are principal,
rate of interest, and duration in years. 31-32
c) When user clicks the Ok button a message box appears
showing the simple interest of principal amount
 Program Outcome (PO)

The engineering graduate of this institute will demonstrate:

a) Apply knowledge of mathematics, science, computing and engineering fundamentals to computer
science engineering problems.
b) Able to identify, formulate, and demonstrate with excellent programming, and problem solving skills.
c) Design solutions for engineering problems including design of experiment and processes to meet
desired needs within reasonable constraints of manufacturability, sustainability, ecological,
intellectual and health and safety considerations.
d) Propose and develop effective investigational solution of complex problems using research
methodology; including design of experiment, analysis and interpretation of data, and combination of
information to provide suitable conclusion. synthesis
e) Ability to create, select and use the modern techniques and various tools to solve engineering problems
and to evaluate solutions with an understanding of the limitations.
f) Ability to acquire knowledge of contemporary issues to assess societal, health and safety, legal and
cultural issues.
g) Ability to evaluate the impact of engineering solutions on individual as well as organization in a societal
and environmental context, and recognize sustainable development, and will be aware of emerging
technologies and current professional issues.
h) Capability to possess leadership and managerial skills, and understand and commit to professional
ethics and responsibilities.
i) Ability to demonstrate the team work and function effectively as an individual, with an ability to design,
develop, test and debug the project, and will be able to work with a multi-disciplinary team.
j) Ability to communicate effectively on engineering problems with the community, such as being able
to write effective reports and design documentation.
k) Flexibility to feel the recognition of the need for, and have the ability to engage in independent and life-
long learning by professional development and quality enhancement programs in context of
technological change.
l) A practice of engineering and management principles and apply these to one’s own work, as a member
and leader in a team, to manage projects and entrepreneurship
 Acropolis Institute of Technology and Research, Indore
Department of CSE (Artificial Intelligence & Machine Learning)
Lab: Internet and Web
Group / Title: HTML Table
Technology (AL703D)
EVALUATION RECORD Type/ Lab Session: Regular
Name Shwet Pardhi Enrollment No. 0827AL211039
Performing on First submission Second submission
Extra Regular

Grade and Remarks by the Tutor

1. Clarity about the objective of experiment
2. Clarity about the Outcome
3. Submitted the work in desired format
4. Shown capability to solve the problem
5. Contribution to the team work

Additional remarks

Grade: Cross the grade.

A B C D F

1. Title: Create a table in HTML to the following details

2. Neatly Drawn and labeled experimental setup : NA
3. Theoretical solution of the instant problem
• Algorithm:
▪ A table in HTML is a way to organize and present data in rows and
columns.
▪ The main HTML tags used for creating tables are <table>, <tr>, <th>, and
<td.
▪ <table> defines the entire table.
▪ <tr> defines a table row.
▪ <th> is used for table header cells, typically at the top of columns or rows.
• <td> is used for regular data cells, containing the actual data to be
displayed.
• Program:
<!DOCTYPE html>
<html>
<head>
 <title>Book List</title>
</head>
<body>

<h1>Book List</h1>

<table border="1">
<tr>
<th>Book Name</th>
<th>Author</th>
</tr>
<tr>
<td>Operating System</td>
<td>Godbole</td>
</tr>
<tr>
<td>Data Communication and Network</td>
<td>Godbole</td>
</tr>
<tr>
<td>Computer Network</td>
<td>Rajkumar</td>
</tr>
<tr>
<td>OOPs</td>
<td>R.Nageswara Rao</td>
</tr>
</table>
</body>
</html>

4. Tabulation Sheet: NA
5. Result:

Page 10
 Acropolis Institute of Technology and Research, Indore
Department of CSE (Artificial Intelligence & Machine Learning)
Lab: Internet and Web Group / Title: Application Form
Technology (AL703D)
EVALUATION RECORD Type/ Lab Session: Regular
Name Shwet Pardhi Enrollment No. 0827AL211039
Performing on First submission Second submission
Extra Regular

Grade and Remarks by the Tutor

1. Clarity about the objective of experiment
2. Clarity about the Outcome
3. Submitted the work in desired format
4. Shown capability to solve the problem
5. Contribution to the team work

Additional remarks

Grade: Cross the grade.

A B C D F

1. Title: Create a job application form

• Create an area called section one and place text boxes that receives details –
b) Name b) Age c) Gender d) High School
e) Qualifications
• Create an area called section two and place text boxes that receives details -
a) Previous Employment b) References
c) Qualification
At the end place a submit button

2Neatly Drawn and labeled experimental setup : NA

3Theoretical solution of the instant problem

• Algorithm:
• In HTML, a <form> is used to create an interactive input form that
allows users to submit data to a server.
• The <form> tag contains various form elements, such as text
fields, radio buttons, checkboxes, and buttons.
• Users can input data into these form elements, and upon
submission, the data is sent to the server for processing.

Page 11
 • The action attribute of the <form> tag specifies the URL where the
form data will be sent.
• The method attribute defines how the data is sent, typically using
methods like "GET" or "POST."
• Form elements have various types and attributes to control input
validation, appearance, and behavior.

• Program:

<!DOCTYPE html>
<html>
<head>
<title>Job Application Form</title>
<style>
/* Add your CSS styling here */
.form-section {
margin-bottom: 20px;
}
</style>
</head>
<body>
<h1>Job Application Form</h1>
<form action="process_application.php" method="post">
<!-- Section One -->
<div class="form-section">
<h2>Section One</h2>
<label for="name">Name:</label>
<input type="text" id="name" name="name" required><br>
<label for="age">Age:</label>
<input type="text" id="age" name="age" required><br>
<label>Gender:</label><br>
<input type="radio" id="male" name="gender" value="Male">
<label for="male">Male</label>
<input type="radio" id="female" name="gender" value="Female">
<label for="female">Female</label>
<input type="radio" id="other" name="gender" value="Other">
<label for="other">Other</label><br>
<label for="high_school">High School:</label>
<input type="text" id="high_school" name="high_school" required><br>
<label for="qualifications">Qualifications:</label>
<textarea id="qualifications" name="qualifications" rows="4"
Page 12
cols="50"></textarea><br>

Page 13
 </div>
<!-- Section Two -->
<div class="form-section">
<h2>Section Two</h2>
<label for="previous_employment">Previous Employment:</label>
<textarea id="previous_employment" name="previous_employment"
rows="4" cols="50"></textarea><br>
<label for="references">References:</label>
<textarea id="references" name="references" rows="4"
cols="50"></textarea><br>
<label for="qualification">Qualification:</label>
<input type="text" id="qualification" name="qualification"><br>
</div>
<input type="submit" value="Submit">
</form>
</body>
</html>
4. Tabulation Sheet: NA
5. Result:

Page 14
 Acropolis Institute of Technology and Research, Indore
Department of CSE (Artificial Intelligence & Machine Learning)
Lab: Internet and Web Group / Title: Web Page
Technology (AL703D)
EVALUATION RECORD Type/ Lab Session: Regular
Name Shwet Pardhi Enrollment No. 0827AL211039
Performing on First submission Second submission
Extra Regular

Grade and Remarks by the Tutor

1. Clarity about the objective of experiment
2. Clarity about the Outcome
3. Submitted the work in desired format
4. Shown capability to solve the problem
5. Contribution to the team work

Additional remarks

Grade: Cross the grade.

A B C D F

1. Title: Create a web page multiple types of style sheet used in a single page.
2. Neatly Drawn and labeled experimental setup : NA
3. Theoretical solution of the instant problem

a. Algorithm:
• A web page is a document on the World Wide Web that can contain text, images, links,
and interactive elements. It's typically written in HTML and can be viewed in a web
browser.
• A style sheet (or stylesheet) is a set of rules that define the visual appearance and layout
of elements on a web page. It is often written in CSS (Cascading Style Sheets) and
helps control the design, colors, fonts, and positioning of page content.
• Web pages structure content and provide information, while style sheets enhance their
presentation by controlling design and aesthetics.
• Combining HTML for content and CSS for styling creates a visually appealing and
well-structured web page.
b. Program:

Page 15
 <!DOCTYPE html>
<html>
<head>
<title>Multiple Style Sheets Example</title>
<link rel="stylesheet" type="text/css" href="style1.css">
<link rel="stylesheet" type="text/css" href="style2.css">
<style>
/* Inline style sheet */
h1 {
color: red;
}
</style>
</head>
<body>
<h1>Multiple Style Sheets Example</h1>
<p>This is an example of how to use multiple types of style sheets in a single web
page.</p>
</body>
</html>
4. Tabulation Sheet: NA
5. Result:

Page 16
 Acropolis Institute of Technology and Research, Indore
Department of CSE (Artificial Intelligence & Machine Learning)
Lab: Internet and Web Group / Title: Java Script Program
Technology (AL703D)
EVALUATION RECORD Type/ Lab Session: Regular
Name Shwet Pardhi Enrollment No. 0827AL211039
Performing on First submission Second submission
Extra Regular

Grade and Remarks by the Tutor

1. Clarity about the objective of experiment
2. Clarity about the Outcome
3. Submitted the work in desired format
4. Shown capability to solve the problem
5. Contribution to the team work

Additional remarks

Grade: Cross the grade.

A B C D F

1. Title: Write a Java Script program by using variables.

2. Neatly Drawn and labeled experimental setup : NA
3. Theoretical solution of the instant problem
a. Algorithm:
• JavaScript is a versatile programming language used to add interactivity and
functionality to web pages. It runs in web browsers and allows developers to
create dynamic features like form validation, animations, and responsive
behavior.
• A variable in JavaScript is a named container that stores data. It can hold
different types of information, such as numbers, text, or objects. Variables are
used to store and manipulate data within JavaScript programs.
b. Program:
var num1, num2, operation;
num1 = parseFloat(prompt("Enter the first number:"));
operation = prompt("Enter an operation (+, -, *, /):");
num2 = parseFloat(prompt("Enter the second number:"));
var result;

Page 17
 if (operation === "+") {
result = num1 + num2;
} else if (operation === "-") {
result = num1 - num2;
} else if (operation === "*") {
result = num1 * num2;
} else if (operation === "/") {
if (num2 !== 0) {
result = num1 / num2;
} else {
result = "Division by zero is not allowed.";
}
} else {
result = "Invalid operation";
}
console.log("Result: " + result);

c. Tabulation Sheet

INPUT OUTPUT
Enter the first number: 5 10
Enter an operation (+, -, *, /):"): *
Enter the second number: 2

d. Result:

Page 18
 Acropolis Institute of Technology and Research, Indore
Department of CSE (Artificial Intelligence & Machine Learning)
Lab: Internet and Web Group / Title: Java Script Form
Technology (AL703D)
EVALUATION RECORD Type/ Lab Session: Regular
Name Shwet Pardhi Enrollment No. 0827AL211039
Performing on First submission Second submission
Extra Regular

Grade and Remarks by the Tutor

1. Clarity about the objective of experiment
2. Clarity about the Outcome
3. Submitted the work in desired format
4. Shown capability to solve the problem
5. Contribution to the team work
Additional remarks

Grade: Cross the grade.

A B C D F

1. Title: Write a java script program on Form Validations.

2. Neatly Drawn and labeled experimental setup : NA
3. Theoretical solution of the instant problem
a. Algorithm:
• Form validation in JavaScript is a process of checking user-inputted data in web
forms to ensure it meets specific criteria or constraints before submission to the
server.
• JavaScript is used to create validation functions that run when a form is
submitted, checking the data entered by the user.
• Common validation checks include ensuring fields are not empty, validating
email addresses, enforcing character length limits, and verifying numeric input.
• Validation functions typically return true to allow form submission when data
meets criteria and false to prevent submission when validation fails, often
accompanied by error messages for the user.

Page 19
b. Program
<!DOCTYPE html>
<html>
<head>
<title>Form Validation Example</title>
<script>
function validateForm() {
var name = document.forms["myForm"]["name"].value;
var email = document.forms["myForm"]["email"].value;
var password = document.forms["myForm"]["password"].value;

if (name == "") {
alert("Name must be filled out");
return false;
}

if (email == "") {
alert("Email must be filled out");
return false;
} else {
// Simple email validation using a regular expression
var emailPattern = /^\w+@[a-zA-Z_]+\.[a-zA-Z]{2,3}$/;
if (!email.match(emailPattern)) {
alert("Invalid email address");
return false;
}
}

if (password == "") {
alert("Password must be filled out");
return false;
} else {
// Password should be at least 6 characters long
if (password.length < 6) {
alert("Password should be at least 6 characters long");
return false;
}
}

return true;
}
</script>

Page 1
 </head>
<body>
<h2>Form Validation Example</h2>
<form name="myForm" onsubmit="return validateForm()" method="post">
Name: <input type="text" name="name"><br><br>
Email: <input type="text" name="email"><br><br>
Password: <input type="password" name="password"><br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
4. Tabulation Sheet : NA
5. Result:

Page 20
 Acropolis Institute of Technology and Research, Indore
Department of CSE (Artificial Intelligence & Machine Learning)
Lab: Internet and Web Group / Title: XML Document
Technology (AL703D)
EVALUATION RECORD Type/ Lab Session: Regular
Name Arya Sohan Enrollment No. 0827AL211039
Performing on First submission Second submission
Extra Regular

Grade and Remarks by the Tutor

1. Clarity about the objective of experiment
2. Clarity about the Outcome
3. Submitted the work in desired format
4. Shown capability to solve the problem
5. Contribution to the team work
Additional remarks

Grade: Cross the grade.

A B C D F

1. Title: Create an XML document template to describe the result of students in an

examination. The description should include the student’s roll number, name, three subject
names and marks, total marks, percentage and results.
2. Neatly Drawn and labeled experimental setup : NA
3. Theoretical solution of the instant problem
a. Algorithm:
a. An XML document is a structured text-based data format used for data
interchange and storage.
b. XML documents consist of elements enclosed within tags.
c. Elements can have attributes and text content.
d. Tags are used to define the structure and hierarchy of data within the
document.
e. Proper nesting and well-formed structure are essential in XML documents.
f. XML documents often include a prolog with an XML declaration and may
have optional comments.
g. XML is both human-readable and machine-readable, making it a versatile
format for data representation and exchange.

Page 21
 b. Program
<examination_result>
<student>
<roll_number>STUDENT_ROLL_NUMBER</roll_number>
<name>STUDENT_NAME</name>
<subjects>
<subject>
<name>SUBJECT_1_NAME</name>
<marks>SUBJECT_1_MARKS</marks>
</subject>
<subject>
<name>SUBJECT_2_NAME</name>
<marks>SUBJECT_2_MARKS</marks>
</subject>
<subject>
<name>SUBJECT_3_NAME</name>
<marks>SUBJECT_3_MARKS</marks>
</subject>
</subjects>
<total_marks>TOTAL_MARKS</total_marks>
<percentage>PERCENTAGE</percentage>
<result>RESULT</result>
</student>
</examination_result>

4. Tabulation Sheet : NA
5. Result:

Page 22
 Acropolis Institute of Technology and Research, Indore
Department of CSE (Artificial Intelligence & Machine Learning)
Lab: Internet and Web Group / Title: Calculator
Technology (AL703D)
EVALUATION RECORD Type/ Lab Session: Regular
Name Shwet Pardhi Enrollment No. 0827AL211039
Performing on First submission Second submission
Extra Regular

Grade and Remarks by the Tutor

1. Clarity about the objective of experiment
2. Clarity about the Outcome
3. Submitted the work in desired format
4. Shown capability to solve the problem
5. Contribution to the team work
Additional remarks

Grade: Cross the grade.

A B C D F

1. Title: Design a digital calculator using HTML and Java script

2. Neatly Drawn and labeled experimental setup : NA
3. Theoretical solution of the instant problem
a. Algorithm:
▪ HTML Structure: Create an HTML structure with input fields and buttons
for a calculator.
▪ JavaScript Functionality: Implement JavaScript functions to handle user
interactions, perform calculations, and update the display.
▪ User Interface Updates: Update the display to show user input and results.
▪ Error Handling: Consider error handling for scenarios like division by
zero.
▪ Styling: Apply CSS styles for visual appeal.
b. Program:
Calc.html:
<!DOCTYPE html>
<html>
<head>
<title>Simple Calculator</title>

Page 23
 <link rel="stylesheet" type="text/css" href="calculator.css">
</head>
<body>
<div class="calculator">
<input type="text" id="display" readonly>
<div class="buttons">
<button class="number" onclick="appendToDisplay('7')">7</button>
<button class="number" onclick="appendToDisplay('8')">8</button>
<button class="number" onclick="appendToDisplay('9')">9</button>
<button class="operator" onclick="appendToDisplay('+')">+</button>
<button class="number" onclick="appendToDisplay('4')">4</button>
<button class="number" onclick="appendToDisplay('5')">5</button>
<button class="number" onclick="appendToDisplay('6')">6</button>
<button class="operator" onclick="appendToDisplay('-')">-</button>
<button class="number" onclick="appendToDisplay('1')">1</button>
<button class="number" onclick="appendToDisplay('2')">2</button>
<button class="number" onclick="appendToDisplay('3')">3</button>
<button class="operator" onclick="appendToDisplay('*')">*</button>
<button class="clear" onclick="clearDisplay()">C</button>
<button class="number" onclick="appendToDisplay('0')">0</button>
<button class="equals" onclick="calculateResult()">=</button>
<button class="operator" onclick="appendToDisplay('/')">/</button>
</div>
</div>
<script src="calculator.js"></script>
</body>
</html>

Calculator.css :
.calculator {
width: 300px;
margin: 0 auto;
text-align: center;
padding: 10px;
border: 2px solid #ccc;
border-radius: 10px;
}
#display {
width: 100%;
font-size: 24px;
padding: 10px;
margin: 5px;

Page 24
 text-align: right;
}
.buttons {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 5px;
}
button {
font-size: 18px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
cursor: pointer;
}
button:hover {
background-color: #eee;
}
.number, .operator, .clear, .equals {
background-color: #f4f4f4;
}
.clear, .equals {
background-color: #f27c7c;
color: #fff;
}
4. Tabulation Sheet : NA
5. Result:

Page 25
 Acropolis Institute of Technology and Research, Indore
Department of CSE (Artificial Intelligence & Machine Learning)
Lab: Internet and Web Group / Title: Web Page (College)
Technology (AL703D)
EVALUATION RECORD Type/ Lab Session: Regular
Name Shwet Pardhi Enrollment No. 0827AL211039
Performing on First submission Second submission
Extra Regular

Grade and Remarks by the Tutor

1. Clarity about the objective of experiment
2. Clarity about the Outcome
3. Submitted the work in desired format
4. Shown capability to solve the problem
5. Contribution to the team work
Additional remarks

Grade: Cross the grade.

A B C D F

1. Title: Create a web page with the following constrains

i) a clickable image ii) a hyperlink to your college web site
2. Neatly Drawn and labeled experimental setup : NA
3. Theoretical solution of the instant problem
a. Algorithm:
• A web page is a document or resource accessible on the World Wide Web
(WWW) through a web browser. It typically consists of text, images,
multimedia content, and hyperlinks. Web pages are written in HTML
(Hypertext Markup Language) and can include CSS (Cascading Style
Sheets) and JavaScript to control layout, design, and interactivity.
b. Program:
<!DOCTYPE html>
<html>
<head>
<title>My Web Page</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;

Page 26
 }
#image-container {
margin-top: 50px;
}
#college-link {
text-decoration: none;
color: #0077b6; /* Link color */
}
</style>
</head>
<body>
<h1>Welcome to My Web Page</h1>
<div id="image-container">
<a href="https://aitr.ac.in/" id="college-link">
<img src="https://aiper.ac.in/wp-content/uploads/2023/03/AITR-
logo.jpg" alt="Clickable Image" width="300" height="200">
</a>
</div>
<p>Click the image to visit my college's website.</p>
</body>
</html>

4. Tabulation Sheet : NA
5. Result

Page 27
 Acropolis Institute of Technology and Research, Indore
Department of CSE (Artificial Intelligence & Machine Learning)
Lab: Internet and Web Group / Title: Resume
Technology (AL703D)
EVALUATION RECORD Type/ Lab Session: Regular
Name Shwet Pardhi Enrollment No. 0827AL211039
Performing on First submission Second submission
Extra Regular

Grade and Remarks by the Tutor

1. Clarity about the objective of experiment
2. Clarity about the Outcome
3. Submitted the work in desired format
4. Shown capability to solve the problem
5. Contribution to the team work
Additional remarks

Grade: Cross the grade.

A B C D F

1. Title: Prepare a "resume.html" that might include such information as: a) distinguishing
marks b) special interests c) work history d) education and training e) job objective f)
relevant skills and experience
2. Neatly Drawn and labeled experimental setup : NA
3. Theoretical solution of the instant problem
a. Algorithm:
• Creating a resume in HTML means using HTML tags to structure content,
such as headings, paragraphs, lists, and tables, while including hyperlinks
for contact information and links to online profiles. You can style it using
CSS for better visual presentation. After creating and saving the HTML file,
you can share it online or convert it to PDF for traditional distribution.
b. Program:
<!DOCTYPE html>
<html>
<head>
<style>
body {
font-family: Arial, sans-serif;

Page 28
 }
h1 {
color: #333;
}
h2 {
color: #555;
}
.section {
margin-bottom: 20px;
}
</style>
</head>
<body>
<header>
<h1>Anuj Kumar Suhane</h1>
<p>Distinguishing Marks: Birth mark near left ear</p>
<p>Special Interests: Movies, Series, Travelling</p>
</header>
<section class="section">
<h2>Work History</h2>
<p><strong>Project Intern</strong> - IIT Indore, Indore Madhya
Pradesh | May 2023 - Aug 2023</p>
<ul>
<li>Developed and maintained web applications using Python, Flask,
HTML & CSS.</li>
<li>Collaborated with cross-functional teams to deliver projects on
time.</li>
<li>Improved the company's website.</li>
</ul>
</section>
<section class="section">
<h2>Education and Training</h2>
<p><strong>Bachelor of Science in Computer Science(AIML)</strong>
- Acropolis institute of Technology and Research, Indore, Madhya
Pradesh</p>
<p><strong>AWS Cloud Practitioner </strong> - Amazon Web Services
| April 2023</p>
</section>
<section class="section">
<h2>Job Objective</h2>
<p>Seeking a challenging software development position that allows me
to leverage my technical skills and contribute to innovative projects.</p>

Page 29
 </section>
<section class="section">
<h2>Relevant Skills and Experience</h2>
<ul>
<li>Programming Languages: Python, C++, Javascript</li>
<li>Web Development: HTML, CSS, React, Flask, Django</li>
<li>Version Control: GitHub</li>
<li>Problem Solving and Analytical Skills</li>
<li>Team Collaboration and Communication</li>
</ul>
</section>
</body>
</html>
6. Tabulation Sheet : NA
7. Result:

Page 30
 Acropolis Institute of Technology and Research, Indore
Department of CSE (Artificial Intelligence & Machine Learning)
Lab: Internet and Web Group / Title: Simple Interest Calculator
Technology (AL703D)
EVALUATION RECORD Type/ Lab Session: Regular
Name Shwet Pardhi Enrollment No. 0827AL211039
Performing on First submission Second submission
Extra Regular

Grade and Remarks by the Tutor

1. Clarity about the objective of experiment
2. Clarity about the Outcome
3. Submitted the work in desired format
4. Shown capability to solve the problem
5. Contribution to the team work
Additional remarks

Grade: Cross the grade.

A B C D F

1. Title: Create a HTML document with JavaScript code that

a) Has three textboxes and a button
b) The details to be accepted using textboxes are principal, rate of interest, and duration
in years.
c) When user clicks the Ok button a message box appears showing the simple interest of
principal amount
2. Neatly Drawn and labeled experimental setup : NA
3. Theoretical solution of the instant problem
a. Algorithm: NA
b. Program:
<!DOCTYPE html>
<html>
<head>
<title>Simple Interest Calculator</title>
</head>
<body>
<h1>Simple Interest Calculator</h1>
<label for="principal">Principal Amount:</label>
<input type="text" id="principal" placeholder="Enter Principal
Amount"><br><br>

Page 31
 <label for="rate">Rate of Interest (%):</label>
<input type="text" id="rate" placeholder="Enter Rate of
Interest"><br><br>
<label for="duration">Duration (in years):</label>
<input type="text" id="duration" placeholder="Enter Duration in
Years"><br><br
<button onclick="calculateSimpleInterest()">Calculate</button>
<script>
function calculateSimpleInterest() {
var principal =
parseFloat(document.getElementById("principal").value);
var rate = parseFloat(document.getElementById("rate").value);
var duration =
parseFloat(document.getElementById("duration").value);
if (isNaN(principal) || isNaN(rate) || isNaN(duration)) {
alert("Please enter valid numbers for all fields.");
} else {
var simpleInterest = (principal * rate * duration) / 100;
alert("Simple Interest: $" + simpleInterest.toFixed(2));
}
}
</script>
</body>
</html>
4. Tabulation Sheet

INPUT OUTPUT
Principal Amount:400 32
Rate of Interest (%):2
Duration (in years):4

5. Results

Page 32