SlideShare a Scribd company logo
Page | 1
PROGRAM: 1
AIM: Program to perform all tags in HTML.
ALGORITHM:
1. Create <html> tag
2. Create <head> tag
3. Add Title using <title> tag & enclose it with </title> tag.
4. Define <body> tag to determine the main content of HTML doc.
5. Define a <p> paragraph tag to add a paragraph in HTML doc,
6. Enclose it with closing </p> tag.
7. Define <h1> tag to create Headings in HTML doc,
8. And enclose it with closing </h1> tag.
9. Define <img src=”ImageUrl.jpg”/> to add images in HTML doc,
10. Define <a href=”Link”> to add a link on text or image in HTML doc,
11. Enclose it with closing </a> tag.
12. Define <br> Line Break tag to insert a Single line break.
13. Define <ul> tag to define Unordered List. To add elements in a list
we have to define <li> i.e. List item tags to add items in a list.
14. Enclose it with closing </ul> tag.
15. Define <ol> tag to define Ordered List. To add elements in a list we
have to define <li> i.e. List item tags to add items in a list.
16. Enclose it with closing </ol> tag.
17. To add a table in HTML doc. we need to define a <table> tag, <tr>
tag for adding rows in a table & <td> to add the Data in table row.
CODING:
1: HTML Paragraph Tag:
<html>
<head>
<title>Paragraph</title>
</head>
<body>
<p> This is first Paragraph </p>
</body>
</html>
Page | 2
2: HTML Heading Tag:
<html>
<head>
<title>Heading</title>
</head>
<body>
<h1> This is first heading </h1>
<h2> This is Second heading </h2>
</body>
</html>
3: HTML Image Tag:
<html>
<head>
<title>Image</title>
</head>
<body>
<img src="logo.jpg" width="380" height="70" />
</body>
</body>
</html>
4: HTML Link Tag:
<html>
<head>
<title>Link</title>
</head>
<body>
<a href="http://www.google.com"> Click here!! </a>
</body>
</body>
</html>
Page | 3
5: HTML Line Break Tag:
<html>
<head>
<title>Break tag</title>
</head>
<body>
<p>Hello<br>
Hi<br>
How are you? <br>
</p>
</body>
</body>
</html>
6: HTML Unordered List Tag:
<html>
<head>
<title>Unordered List</title>
</head>
<body>
<ul>
<li>Coffee</li>
<li>Milk</li>
<li>Tea</li>
</ul>
</body>
</body>
</html>
7: HTML Ordered List Tag:
<html>
<head>
<title>Ordered List</title>
</head>
<body>
<ol>
<li>Coffee</li>
<li>Milk</li>
Page | 4
<li>Tea</li>
</ol>
</body>
</body>
</html>
8: HTML Table Tag:
<html>
<head>
<title>Table</title>
</head>
<body>
<table border=”1”>
<tr>
<td>Row 1, Cell 1 </td>
<td>Row 2, Cell 2 </td>
</tr>
<table>
</body>
</body>
</html>
RESULT: Program executes successfully.
Page | 5
PROGRAM: 2
AIM: To implement webpage for Feedback Form.
ALGORITHM:
1. <form action="URL to form script" method="POST">
2. Your Name: <br>
3. <input type="text" name="realname"><br>
4. <br>
5. Your email: <br>
6. <input type="text" name="email"><br>
7. <br>
8. Your Feedback: <br>
9. <textarea name="comments" rows="15" cols="50"></textarea><br><br>
10. <input type="submit" value="Submit">
11. </form>
CODING:
<html>
<body bgcolor= "pink">
<center>
<font color="blue">
<h1>FEEDBACK FORM</h1>
</center>
<form method="get" onsubmit="validate()">
<center>
<table border=10px; bgcolor= "orange">
<center><th id="name" colspan="2" bgcolor="aqua">ENTER
YOUR DETAILS BELOW</th></center>
<tr><td>First Name</td>
<td><input type="text" name="t5" size="20"></td></tr>
<tr><td>Last Name</td>
<td><input type="text" name="t6" size="20"></td></tr>
<tr><td>Date of Birth</td>
<td><input type="text" name="t7" size="1"> /
<input type="number" name="t8" size="4"> /
<input type="number" name="t9" size="2">
Page | 6
</td></tr>
<tr><td>Enrollment no.</td>
<td><input type="text" name="t2"
maxlength"10"></td></tr>
<tr><td>Gender</td>
<td>
<input type="radio" value="Male" name="r1">Male</br>
<input type="radio" value="female"
name="r1">Female</td></tr>
<tr><td>Course</td>
<td><select name="s1">
<option value="B tech">B tech</option>
<option value="BCA">BCA</option>
<option value="M tech">M tech</option>
<option value="MCA">MCA</option>
</option></select></td></tr>
<tr><td>Subject</td>
<td><textarea name="ta" row="20"
cols="20"></textarea></td></tr>
<tr>
<td align="center" colspan="2"><input type="Submit"
value="Submit" onclick="return submitData();">
<input type="reset"></td></tr>
</table>
</center>
</form>
</body>
</html>
RESULT: Program executes successfully.
Page | 7
PROGRAM: 3
AIM: To implement webpage Employment detail in HTML
ALGORITHM:
1. Create <HTML> tag.
2. Use <center> tag for alignment of text in center.
3. Create a form method by using
<form method="get"onsubmit="validate()">
4. Create <table> tag and insert the data which you want to add in the
table in its rows. i.e.:
5. <tr>
6. <td> INSERT ELEMENTS </td>
7. </tr>
8. Add input fields by using: <input type="text"first name="t1" size="20">
9. Add Radio Buttons by using: <input type="radio" value="Male"
name="r1">Male
10. Close the </table> tag.
11. Close the </form> tag.
12. Close </html> tag.
CODING:
<html>
<center>
<h1>EMPLOYMENT DETAILS FORM </h1>
</center>
<body bgcolor= "cyan">
<CENTER>
<form method="get"onsubmit="validate()">
<table border=8px; bgcolor= "pink">
<fontface="Century Gothic" font color="white">
<th id="name" colspan="2" bgcolor="WHITE">ENTER
DETAILS</th>
<tr><td>Enter first Name</td>
<td><input type="text"first name="t1"
size="20"></td></tr>
<tr><td>Enter last Name</td>
<td><input type="text"last name="t1"
size="20"></td></tr>
Page | 8
<tr><td>Date Of Birth</td>
<td><input type="text"Date Of Birth="t1"
size="20"></td></tr
<tr><td>Sexcode</td>
<td><input type="radio" value="Male"
name="r1">Male</br>
<input type="radio" value="female"
name="r1">Female</td></tr>
<tr><td>Email Address</td>
<td><input type="text" name="email" maxlength="30"
size="30"></td></tr>
<tr><td>Home Address</td>
<td><textarea name="ta" row="10"
cols="20"></textarea></td></td>
<tr><td>Telephone Number</td>
<td><input type="text" name="telephone"
maxlength="30" size="30"></td></tr>
<tr><td>Qualification</td>
<td><select name="s1">
<option value="B tech">B tech</option>
<option value="M tech">M tech</option>
<option value="MBA">MBA</option>
<option value="MCA">MCA</option>
<option value="Hotel Management">Hotel
Management</option>
<option value="P Hd">P Hd</option>
<option value="Other">Other</option>
</select></td></tr>
<tr><td>Resume</td>
<td><textarea name="ta" row="10"
cols="30"></textarea></td></tr>
<tr><td align="center" colspan="2"><input
type="Submit" value="Submit" onclick="return
submitData();">
<input type="reset"></td></tr>
</table>
</form>
</body>
</html>
RESULT: Program executes successfully.
Page | 9
PROGRAM: 4
AIM: To find maximum of three numbers using Java Script.
ALGORITHM:
1. Create <HTML> tag.
2. Add <script type=”text/JavaScript”> for using Java Script.
3. Input the values of three numbers i.e. a,b & c.
4. Convert these input values into integer values by: a=parseInt(a);
5. Compare the values by using if else Condition Statements.
6. if(a>b && a>c)
7. Print “Greatest number: a”.
8. if(b>a && b>c)
9. Print “Greatest number: b”.
10. if(c>a && c>b)
11. Print “Greatest number: c”.
12. Close </script> tag.
13. Close </HTML> tag.
CODING:
<html>
<head>
<title>largest number</title>
<script language="JavaScript">
a=prompt("Enter first number:");
b=prompt("Enter first number:");
c=prompt("Enter first number:");
a=parseInt(a);
b=parseInt(b);
c=parseInt(c);
if(a>b && a>c)
{
document.write("<h1>Greatest Number is:"+a);
}
else
if(b>a && b>c)
{
Page | 10
document.write("<h1>Greatest Number is:"+b);
}
else
if(c>a && c>b)
{
document.write("<h1>Greatest Number is:"+c);
}
</script>
</body>
RESULT: Program executes successfully.
Page | 11
PROGRAM: 5
AIM: To perform Bubble Sort & Binary Search using Java Script.
1: Bubble Sort:
ALGORITHM:
1. Create <HTML> tag.
2. Add <script type=”text/JavaScript”> for using Java Script.
3. Insert the Elements of array i.e.
4. var array = new Array(15,23,1,69,45,36,7,64,99,5);
5. Create variables “I”, “j” & “k”.
6. Execute for loop:
7. for(i=0;i<arrayLength;i++)
8. {
9. for(j=i+1;j<arrayLength;j++)
10. {
11. if(array[i]<array[j])
12. {
13. k=array[i];
14. array[i]=array[j];
15. array[j]=k;
16. }
17. }
18. }
19. Print the Sorted Array.
CODING:
<html>
<head>
<script type="text/javascript">
var array = new Array(15,23,1,69,45,36,7,64,99,5);
document.write("Array is "+ array);
var arrayLength = array.length;
var i;
var j;
var k;
Page | 12
for(i=0;i<arrayLength;i++)
{
for(j=i+1;j<arrayLength;j++)
{
if(array[i]<array[j])
{
k=array[i];
array[i]=array[j];
array[j]=k;
}
}
}
document.write("<br/>After bubble sort in desending
order " + array);
</script>
</head>
<body>
</body>
</html>
RESULT: Program executes successfully.
Page | 13
2: Binary Search:
ALGORITHM:
1. Create <HTML> tag.
2. Add <script type=”text/JavaScript”> for using Java Script.
3. Input the values of size , elements and the item to be searched.
4. function binaryIndexOf(searchElement) { 'use strict';
5. var minIndex = 0;
6. var maxIndex = this.length - 1;
7. var currentIndex;
8. var currentElement;
9. while (minIndex <= maxIndex) {
10. currentIndex = (minIndex + maxIndex) / 2 | 0;
11. currentElement = this[currentIndex];
12.
13. if (currentElement < searchElement) {
14. minIndex = currentIndex + 1;
15. }
16. else if (currentElement > searchElement) {
17. maxIndex = currentIndex - 1;
18. }
19. else {
20. return currentIndex;
21. }
22. }
23.
24. return -1;
25. }
26. Close </script> & <HTML> tag.
CODING:
<html>
<head>
<title>Binary Search</title>
<script type="text/javascript">
Page | 14
function binary()
{
var n=parseInt(prompt("enter the size of an array:
"));
var a=new Array(n);
var p=0;
for(var i=0;i<a.length;i++)
{
a[i]=parseInt(prompt("enter array elements"));
}
for(var i=0;i<a.length;i++)
{
for(var j=i+1;j<a.length;j++)
{
if(a[i]>a[j])
{
var t=a[i];
a[i]=a[j];
a[j]=t;
}
}
}
var k=parseInt(prompt("enter the key element "));
var i=0;
var u=parseInt(a.length-1);
while(i<=u)
{
var m=parseInt((i+u)/2);
if(k==a[m])
{
p=1;
break;
}
else if(k>a[m])
{
i=m+1;
}
else if(k<a[m])
{
u=m-1;
}
}
if(p==1)
document.writeln("element found at :"+m);
Page | 15
else
document.writeln("element not found");
}
</script>
</head>
<body onLoad="binary();"></body>
</html>
RESULT: Program executes successfully.
Page | 16
PROGRAM: 6
AIM: To create Coconut tree in applet.
ALGORITHM:
1. Import Java applet
2. Create a class which extends Applet class
3. Create a public function : public void paint (Graphics g)
4. Set the color of element you wants to add by:
5. g.setColor(Color.red)
6. Create the element by determining its shape:
7. g.fillRect(10,20,30,40)
CODING:
import java.applet.*;
import java.awt.*;
public class tree extends Applet
{
public void paint(Graphics g)
{
g.setColor(Color.black);
g.drawString("COCONUT TREE",200,50);
g.drawArc(120,100,50,300,130,120);
g.drawArc(140,100,50,300,130,120);
g.drawArc(110,90,50,250,0,150);
g.drawArc(140,90,50,300,20,140);
g.drawArc(105,35,50,300,30,110);
g.drawOval(150,110,20,30);
g.drawOval(130,110,20,30);
g.drawOval(140,120,20,30);
g.drawLine(125,155,145,155);
g.drawLine(120,200,140,200);
Page | 17
g.drawLine(120,250,140,250);
g.drawLine(120,300,140,300);
g.drawLine(130,350,150,350);
}
}
//<applet
code="Hut"width="400"height="400"></applet>
RESULT: Program executes successfully.
Page | 18
PROGRAM: 7
AIM: To perform simple TCP/IP Client-Server chat application using java.
ALGORITHM:
1. Import java i/o files.
2. Import java .net files.
3. Create a class GossipClient
4. Declare a main function
5. public static void main(String[ ]args)
6. Create a socket inside throw exception.
7. Add :
8. Buffer Reader ( )
9. Input Stream Reader( )
10. Output Stream Reader( )
11. Print writer( )
12. Apply Condition Statements
13. Print the Results.
CODING:
1: For Client:
import java.io.*;
import java.net.*;
public class GossipClient
{
public static void main(String[]args) throws Exception
{
Socket sock = new Socket("localhost",6789);
BufferedReader keyRead = new BufferedReader(new
InputStreamReader(System.in));
OutputStream ostream = sock.getOutputStream();
PrintWriter pwrite = new PrintWriter(ostream, true);
InputStream istream = sock.getInputStream();
BufferedReader receiveRead = new BufferedReader(new
InputStreamReader(istream));
System.out.println("Start the chitchat, type and press
Enter key");
Page | 19
String receiveMessage,sendMessage;
while(true)
{
sendMessage = keyRead.readLine();
pwrite.println(sendMessage);
System.out.flush();
if((receiveMessage=receiveRead.readLine())!=null)
{
System.out.println(receiveMessage);
}
}
}
}
2: For Server:
import java.io.*;
import java.net.*;
public class GossipServer
{
public static void main(String args[]) throws
Exception
{
ServerSocket sersock = new ServerSocket(6789);
System.out.println("Server ready for chatting");
Socket sock = sersock.accept();
BufferedReader keyRead = new BufferedReader(new
InputStreamReader(System.in));
OutputStream ostream = sock.getOutputStream();
PrintWriter pwrite = new PrintWriter(ostream, true);
InputStream istream = sock.getInputStream();
BufferedReader receiveRead = new BufferedReader(new
InputStreamReader(istream));
String receiveMessage,sendMessage;
while(true)
{
if((receiveMessage = receiveRead.readLine()) !=
null)
{
System.out.println(receiveMessage);
}
Page | 20
sendMessage = keyRead.readLine();
pwrite.println(sendMessage);
System.out.flush();
}
}
}
RESULT: Program executes successfully.
Page | 21
PROGRAM: 8
AIM: To perform operation on Employee table using JDBC Connectivity.
ALGORITHM:
1. Loading the Drivers:
2. Class.forName()
3. DriverManager.registerDriver()
4. Create the Connections
5. Create the statement.
6. Execute the Query.
7. Close the Connection.
CODING:
import java.sql.*;
class EmployeeRecord
{
public static final String DBURL =
"jdbc:oracle:thin:@localhost:1521:XE";
public static final String DBUSER = "local";
public static final String DBPASS = "test";
public static void main(String args[])
{
try
{
//Loading the driver
Class.forName("oracle.jdbc.driver.Oracl
eDriver");
//Cretae the connection object
Connection con =
DriverManager.getConnection(DBURL, DBUSER, DBPASS);
//Insert the record
String sql = "INSERT INTO emp (emp_id,
empname, email, city) VALUES (?, ?, ?, ?)";
PreparedStatement statement =
con.prepareStatement(sql);
statement.setInt(1, 100);
statement.setString(2, "Prashant");
Page | 22
statement.setString(3,
"prasant@saxena.com");
statement.setString(4, "Pune");
int rowsInserted =
statement.executeUpdate();
if (rowsInserted > 0)
{
System.out.println("A new employee
was inserted successfully!n");
}
// Display the record
String sql1 = "SELECT * FROM Emp";
Statement stmt = con.createStatement();
ResultSet result =
stmt.executeQuery(sql1);
while (result.next())
{
System.out.println
(result.getInt(1)+" "+
result.getString(2)+" "+
result.getString(3)+" "+
result.getString(4));
}
//Update the record
String sql2 = "Update Emp set email = ?
where empname = ?";
PreparedStatement pstmt =
con.prepareStatement(sql2);
pstmt.setString(1, "Jaya@gmail.com");
pstmt.setString(2, "Jaya");
int rowUpdate = pstmt.executeUpdate();
if (rowUpdate > 0)
{
System.out.println("nRecord
updated successfully!!n");
}
//Delete the record
Page | 23
String sql3 = "DELETE FROM Emp WHERE
empname=?";
PreparedStatement statement1 =
con.prepareStatement(sql3);
statement1.setString(1, "Prashant");
int rowsDeleted =
statement1.executeUpdate();
if (rowsDeleted > 0)
{
System.out.println("A Employee was
deleted successfully!n");
}
}
catch(Exception ex)
{
ex.printStackTrace();
}
}
}
RESULT: Program executes successfully.
Page | 24
PROGRAM: 9
AIM: To create a Personal Webpage using HTML & CSS
ALGORITHM:
1. Create <HTML> tag
2. Add Title <title> tag
3. Create first Division (DIV) by using CSS Property :
4. .CONT{
5. POSITION:fixed;
6. TOP:1;
7. WIDTH:330;
8. HEIGHT:1350;
9. BACKGROUND-COLOR:#424242;
10. box-shadow: 8px 8px 5px #888888;
11. }
12. Create Second Div :
13. .CONT2{
14. POSITION:ABSOLUTE;
15. TOP:1;
16. LEFT:350;
17. WIDTH:1000;
18. HEIGHT:1350;
19. BACKGROUND-COLOR:#FCFFD5 ;
20. COLOR:WHITE;
21. }
22. Create <body> of the program.
23. Add the declaration of first Division by:
24. <DIV CLASS=CONT> and add the elements you wants to add inside it.
25. Close it by using </div> tag
26. Add the declaration of Second Division by:
27. <DIV CLASS=CONT2> and add the elements you wants to add inside it.
28. Close it by using </div> tag
29. Close </body> and </html> tag.
CODING:
<html>
<head>
Page | 25
<title>Webpage</title>
<style>
.CONT{
POSITION:fixed;
TOP:1;
WIDTH:330;
HEIGHT:1350;
BACKGROUND-COLOR:#424242;
box-shadow: 8px 8px 5px #888888;
}
.CONT2{
POSITION:ABSOLUTE;
TOP:1;
LEFT:350;
WIDTH:1000;
HEIGHT:1350;
BACKGROUND-COLOR:#FCFFD5 ;
COLOR:WHITE;
}
#p0{
POSITION:RELATIVE;
TOP:1;
LEFT:600;
}
.head1{
POSITION:relative;
TOP:10;
WIDTH:950;
HEIGHT:40;
BACKGROUND-COLOR:brown;
COLOR:WHITE;
box-shadow: 5px 5px 5px #888888;
}
#p1{
POSITION:RELATIVE;
TOP:1;
LEFT:10;
}
.head2{
POSITION:relative;
TOP:90;
WIDTH:950;
HEIGHT:40;
BACKGROUND-COLOR:brown;
COLOR:WHITE;
box-shadow: 5px 5px 5px #888888;
}
#p2{
Page | 26
POSITION:RELATIVE;
TOP:1;
LEFT:10;
}
.head3{
POSITION:relative;
TOP:200;
WIDTH:950;
HEIGHT:40;
BACKGROUND-COLOR:brown;
COLOR:WHITE;
box-shadow: 5px 5px 5px #888888;
}
#p3{
POSITION:RELATIVE;
TOP:1;
LEFT:10;
}
.head4{
POSITION:relative;
TOP:420;
WIDTH:950;
HEIGHT:40;
BACKGROUND-COLOR:brown;
COLOR:WHITE;
box-shadow: 5px 5px 5px #888888;
}
#p4{
POSITION:RELATIVE;
TOP:1;
LEFT:10;
}
.head5{
POSITION:relative;
TOP:600;
WIDTH:950;
HEIGHT:40;
BACKGROUND-COLOR:brown;
COLOR:WHITE;
box-shadow: 5px 5px 5px #888888;
}
#p5{
POSITION:RELATIVE;
TOP:1;
LEFT:10;
}
.head6{
POSITION:relative;
Page | 27
TOP:740;
WIDTH:950;
HEIGHT:40;
BACKGROUND-COLOR:brown;
COLOR:WHITE;
box-shadow: 5px 5px 5px #888888;
}
#p6{
POSITION:RELATIVE;
TOP:1;
LEFT:10;
}
div span,
div img {
display: inline-block;
vertical-align: middle;
}
</STYLE></HEAD>
<BODY>
<DIV CLASS=CONT>
<br><center><br><br>
<img src="image.jpg" height="150" width="150">
<font color="white" face="Century Gothic">
<h1>BILAL MIRZA</h1></center>
<left>
<font color="#FAF1A1"
size="5"><br>&nbsp;&nbsp;&nbsp;SOCIAL PROFILE
<font color="white" face="Calibri" size="5"><br>
&nbsp;&nbsp;&nbsp;<img src="facebook.png"
height="40" width="40"><span> &nbsp;<a
href="https://www.facebook.com/bilal.mirza.146"><font
color="#FCFFD5">/bilal.mirza.146</a></span><br>
&nbsp;&nbsp;&nbsp;<img src="insta.png" height="40"
width="40"><span>&nbsp;<a
href="https://www.instagram.com/bilal_mirza_/"><font
color="#FCFFD5">@bilal_mirza_</a></span><br>
&nbsp;&nbsp;&nbsp;<img src="twitter.png" height="40"
width="40"><span>&nbsp;<a
href="https://twitter.com/bilalmirza_"><font
color="#FCFFD5">@bilalmirza_</a></span><br>
&nbsp;&nbsp;&nbsp;<img src="google.png" height="40"
width="40"><span>&nbsp;<a
href="https://plus.google.com/106644495743037247927"><font
color="#FCFFD5">/bilalmirza.01</a></span><br><br><BR><br><br>
<font color="white" face="Calibri" size="3">
&nbsp;Design By: BILAL MIRZA
</DIV>
<DIV CLASS=CONT2>
Page | 28
<p ID=P0><font color="BLACK" face="Century Gothic"
size="5">PERSONAL PROFILE / RESUME</P>
<DIV CLASS=head1>
<font color="white" face="Century Gothic" size="5">
<p ID=p1>OBJECTIVE
<br><font color="black" face="Calibri" size="5"><br>
To serve a responsible position in your organisization
where the company can utilize my abilities to the maximum. I
can grow professionally as well as financially at the same
time.
</p>
</div>
<DIV CLASS=head2>
<font color="white" face="Century Gothic" size="5">
<p ID=p2>EDUCATION
<br><font color="black" face="Calibri" size="5">
<UL>
<li>Pursuing
<font color="brown"><I>Computer Science Engineering
</I>
<font color="black">
from Mohammad Ali Jauhar University, Rampur</li>
<li>Intermidiate with 68% from Stepping Stones School,
Muzaffarnagar.</li>
<li>High School with 65% from Stepping Stones School,
Muzaffarnagar.</li></ul>
</p>
</div>
<DIV CLASS=head3>
<font color="white" face="Century Gothic" size="5">
<p ID=p3>Personal Info
<br><font color="black" face="Calibri" size="5">
<UL>
<li>Full Name : <i>Muhammad Bilal Mirza</i></li>
<li>Father's Name : <i>Mr. Saleem Ahmad</i></li>
<li>Date of Birth : <i>12/04/1997</i></li>
<li>Gender : <i>Male</i></li>
<li>Nationality : <i>Indian</i></li>
<li>Religion : <i>Islam</i></li>
<li>Blood Group : <i>AB+</i></li>
</ul>
</p>
</div>
<DIV CLASS=head4>
<font color="white" face="Century Gothic" size="5">
<p ID=p4>Hobbies
<br><font color="black" face="Calibri" size="5">
<UL>
Page | 29
<li>Programming</li>
<li>Computing</i></li>
<li>Learning New Things</i></li>
<li>Reading</li>
<li>Photography</li>
</ul>
</p>
</div>
<DIV CLASS=head5>
<font color="white" face="Century Gothic" size="5">
<p ID=p5>Computer Languages
<br><font color="black" face="Calibri" size="5">
<UL>
<li>HTML 5</li>
<li>Java Script</i></li>
<li>Java</i></li>
<li>C++</li>
</ul>
</p>
</div>
<DIV CLASS=head6>
<font color="white" face="Century Gothic" size="5">
<p ID=p6>Contact Me
<br><font color="black" face="Calibri" size="5">
<UL>
<li>Phone: <i>&nbsp;+91-8791314025</i></li>
<li>E-Mail:<i>&nbsp;bilalmirza.01@gmail.com</i></li>
<li>Website:
<i>&nbsp;www.mdbilalmirza.webs.com</i></li>
<li>Address:<i>&nbsp;Mehmood Nagar,
Muzaffarnagar</i></li>
</ul>
</p>
</div>
</DIV>
</BODY>
</HTML>
RESULT: Program executes successfully.
Page | 30
PROGRAM: 10
AIM: To create a webpage for university using HTML.
ALGORITHM:
1. Create <HTML> tag.
2. Add background color; <body bgcolor=”red”>
3. Define a table by using <table> tag.
4. Add the contents in the table i.e. the Logo and the Title.
5. Create another table and add the links of other pages into it. i.e.
Home, About, Admission, Contact us, Results.
6. Add links of these pages by <a href=”home.html”>HOME</a>
7. Create a paragraph to write the contents <p>
8. Add image by using <img src=”image.jpg”> tag
9. Add the elements according to your requirements.
CODING:
1:Home page:
<html>
<head>
<title>Admission form</title>
<body>
<center>
<body bgcolor="FFCC99">
<table><table border=0px; bgcolor= "CC6633"
width="1350" height="200">
<tr>
<td><img src="logo.png" width="150" height"150"></td>
<td><font color="yellow" face="Tahoma"><u>
<h1>MOHAMMAD ALI JAUHAR UNIVERSITY</h1></u>
<font color="white" face="Tahoma">
<h2>Jauhar Nagar, Rampur, U.P., India</h2>
</td></tr></th>
</table>
<table><table border=0px; bgcolor= "yellow"
width="1350">
<tr>
Page | 31
<td><font color="black" face="Tahoma"><b><CENTER><a
href="home.html">HOME</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="about.html">ABOUT</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="admissions.html">ADMISSIONS</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="contact.html">CONTACT US</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="results.html">RESULTS</a></td>
</tr>
</table>
<br><br>
<table><table border=0px; bgcolor= "FFCC99"
width="1350">
<tr>
<td>
<font size="6" color="RED" face="Tahoma"><B>
WELCOME<BR></B>
<font size="4" color="black" face="Tahoma">
The Mohammad Ali Jauhar University situatied at Rampur
is one of the best institution which provides quality
education,
The university was establish by Ex-Cabinet Minister
Mohammad Azam Khan.
Mohammad Ali Jauhar University, Rampur was established
in the year 2006 by an Act of State Legislature of
Uttar Pradesh. It is approximately 12 km from Rampur
Railway Station. The University caters courses in
various streams of Science, Humanities, Law,
Education, Commerce, Engineering & Technology,
Paramedical Sciences including Nursing, Mass
Communication and Agriculture and is almost prepare to
start a Medical College named as Jauhar Institute of
Medical Sciences (JIMS).
</td>
<td><img src="img.jpg" width="400" height="250"></td>
</tr>
<tr><td>
<ul><li><font size="5" color="black" face="Tahoma">
HIGHEST ORDER
Page | 32
<br>
Our objective is to impart multidisciplinary education
at UG/PG and PhD level of excellent level.
</td>
<tr><td>
<ul><li><font size="5" color="black" face="Tahoma">
RANKING
<br>
Mohammad Ali Jauhar University has been placed at high
rank among Indian private universities by several
magazines and newspapers.
</td>
<tr><td>
<ul><li><font size="5" color="black" face="Tahoma">
SKILLED FACULTY
<br>
Excellent faculty as per UGC norms is the criteria of
induction. Devoted and dedicated faculty who not only
interact with the students in the classrooms but
beyond the classrooms to enthuse them for the pursuit
of knowledge in their subjects of study, consciousness
about the environment and their social
responsibilities is our trade mark.
</td>
</table>
<center>
<font color="BLACK" face="Tahoma">
<font color="BLACK" face="Tahoma"
size="3"><br><br><br><br>
<H3>Page Design by MOHD.BILAL</H3>
<h4>Contact: bilalmirza.01@gmail.com</h4>
</body>
</html>
2:About:
<html>
<head>
<title>Admission form</title>
<body>
Page | 33
<center>
<body bgcolor="FFCC99">
<table><table border=0px; bgcolor= "CC6633"
width="1350" height="200">
<tr>
<td><img src="logo.png" width="150" height"150"></td>
<td><font color="yellow" face="Tahoma"><u>
<h1>MOHAMMAD ALI JAUHAR UNIVERSITY</h1></u>
<font color="white" face="Tahoma">
<h2>Jauhar Nagar, Rampur, U.P., India</h2>
</td></tr></th>
</table>
<table><table border=0px; bgcolor= "yellow"
width="1350">
<tr>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="home.html">HOME</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="about.html">ABOUT</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="admissions.html">ADMISSIONS</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="contact.html">CONTACT US</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="results.html">RESULTS</a></td>
</tr>
</table>
<font SIZE="5" color="black" face="Tahoma">
<BR>
WELCOME TO<br><font color="red" size="8"><b>
JAUHAR UNIVERSITY</b>
<br><font color="black" size="4"></center><ul><li>
Mohammad Ali Jauhar University, Rampur was established
in the year 2006 by an Act of State Legislature of
Uttar Pradesh. It is approximately 12 km from Rampur
Railway Station. The University caters courses in
various streams of Science, Humanities, Law,
Education, Commerce, Engineering & Technology,
Paramedical Sciences including Nursing, Mass
Communication and Agriculture and is almost prepare to
Page | 34
start a Medical College named as Jauhar Institute of
Medical Sciences (JIMS).
</li><br><li>The University campus is spread over more
than 350 acres and has vast lush green, health
sustaining and beautiful landscapes. The bio-
aesthetics is further enhanced with the presence of a
very huge water body – a source of rich floral and
faunal diversity. Ultra modern infrastructure designed
by eminent architects is the signature of its beauty.
The tranquil ambience of the premises creates the
ideal environment for serious study.
</li><br><li>Stress is also being given on physical
fitness of the students and for this the University
has paid adequate attention on promotion of sports on
campus. A huge, well-equipped, hi-tech gymnasium with
indoor games facilities, viz. badminton, chess, carom,
table tennis and outdoor games like football, hockey,
cricket, lawn tennis, volleyball, horse riding etc.
have been created. National and
state level sport competitions are periodically
organized by the University. Along with this a stadium
with latest facilities is also underway on completion
to promote sports with studies.
The objective of the University is to mark excellence
in its academic programs and sports. The University is
committed to its social mission of making education
possible to sons and daughters of persons of the down-
trodden sections of the society and Muslim minority as
well.
</ul></li>
</TABLE>
<center>
<font color="BLACK" face="Tahoma"
size="3"><br><br><br><br>
<H3>Page Design by MOHD.BILAL</H3>
<h4>Contact: bilalmirza.01@gmail.com</h4>
</body>
</html>
Page | 35
3:Admissions:
<html>
<head>
<title>Admission form</title>
<body>
<center>
<body bgcolor="FFCC99">
<table><table border=0px; bgcolor= "CC6633"
width="1350" height="200">
<tr>
<td><img src="logo.png" width="150" height"150"></td>
<td><font color="yellow" face="Tahoma"><u>
<h1>MOHAMMAD ALI JAUHAR UNIVERSITY</h1></u>
<font color="white" face="Tahoma">
<h2>Jauhar Nagar, Rampur, U.P., India</h2>
</td></tr></th>
</table>
<table><table border=0px; bgcolor= "yellow"
width="1350">
<tr>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="home.html">HOME</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="about.html">ABOUT</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="admissions.html">ADMISSIONS</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="contact.html">CONTACT US</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="results.html">RESULTS</a></td>
</tr>
</table>
<font color="black" face="Tahoma">
<table border=0px; bgcolor= "FFCC99"width="1350">
<br><th id="name" colspan="4" bgcolor="white">ENTER
YOUR DETAILS BELOW</th></center>
<tr><td>First Name</td>
<td><input type="text" name="t1" size="20"></td></tr>
<tr><td>Last name</td>
<td><input type="text" name="t2" size="20"></td></tr>
<tr><td>Father's Name</td>
Page | 36
<td><input type="text" name="t1" size="20"></td></tr>
<tr><td>Mother's Name</td>
<td><input type="text" name="t2" size="20"></td></tr>
<tr><td>Date of Birth</td>
<td><select name="s1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select name="s2">
<option value="Jan">Jan</option>
<option value="Feb">Feb</option>
<option value="March">March</option>
Page | 37
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="Aug">Aug</option>
<option value="Sept">Sept</option>
<option value="Oct">Oct</option>
<option value="Nov">Nov</option>
<option value="Dec">Dec</option>
</select>
<select name="s3">
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2000">2000</option>
</select>
</td></tr>
<tr><td>Gender</td>
<td><input type="radio" value="Male"
name="r1">Male</br>
<input type="radio" value="female"
name="r1">Female</td></tr>
<tr><td>Mobile No.:</td>
<td><input type="number" name="t3"
size="10"></td></tr>
<tr><td>Select Category</td>
<td><select name="s6">
<option value="Minority">Minority</option>
<option value="OBC">OBC</option>
<option value="General">General</option>
<option value="SC/ST">SC/ST</option>
</select></td></tr>
<th id="name" colspan="2" bgcolor="white">ENTER YOUR
ACADEMIC DETAILS</th>
<tr><td>Class 10th Marks</td>
<td><input type="text" name=t4" size="3"> %</td></tr>
Page | 38
<tr><td>Class 12th Marks</td>
<td><input type="text" name=t5" size="3"> %</td></tr>
<tr><td>Lats year Qualified exam marks </td>
<td><input type="text" name=t4" size="3"> %</td></tr>
<th id="name" colspan="2" bgcolor="white">COURSE
DETAILS</th>
<tr><td>Select Course</td>
<td><select name="s4">
<option value="B.tech">B.tech</option>
<option value="BCA">BCA</option>
<option value="Diploma">Diploma</option>
<option value="B.com">B.com</option>
<option value="BBA">BBA</option>
<option value="B.sc">B.sc</option>
<option value="B.Pharma">B.Pharma</option>
</select></td></tr>
<tr><td>Select Branch(if any)</td>
<td><select name="s5">
<option value="Computer Science">Computer
Science</option>
<option value="Civil">Civil</option>
<option value="Mechinical">Mechinical</option>
<option value="Electrical">Electrical</option>
<option value="Electronics">Electronics</option>
<option value="Bio-Chemistry">Bio-Chemistry</option>
<option value="Zoology">Zoology</option>
<option value="Botany">Botany</option>
<option value="Physics">Physics</option>
<option value="None">None</option>
</select></td></tr>
<th id="name" colspan="2" bgcolor="white">HOSTEL
DETAILS</th>
<tr><td>Hostel Required</td>
<td><input type="radio" value="Yes" name="r2">Yes
<input type="radio" value="No" name="r2"> No</td></tr>
<tr><td>Hostel Category</td>
<td><input type="radio" value="AC" name="r3">AC
<input type="radio" value="Non AC" name="r3"> Non
AC</td></tr>
<tr>
Page | 39
<td><br><b><input type="checkbox" value="correct"
name="r4">I Herby declare that the information
provided by me are correct</td>
</tr>
<tr><td align="center" colspan="2"><input
type="Submit" value="Submit" onclick="return
submitData();">
<input type="reset"></td></tr>
</TABLE>
<center>
<font color="BLACK" face="Tahoma"
size="3"><br><br><br><br>
<H3>Page Design by MOHD.BILAL</H3>
<h4>Contact: bilalmirza.01@gmail.com</h4>
</body>
</html>
4: Contact Us:
<html>
<head>
<title>Admission form</title>
<body>
<center>
<body bgcolor="FFCC99">
<table><table border=0px; bgcolor= "CC6633"
width="1350" height="200">
<tr>
<td><img src="logo.png" width="150" height"150"></td>
<td><font color="yellow" face="Tahoma"><u>
<h1>MOHAMMAD ALI JAUHAR UNIVERSITY</h1></u>
<font color="white" face="Tahoma">
<h2>Jauhar Nagar, Rampur, U.P., India</h2>
</td></tr></th>
</table>
<table><table border=0px; bgcolor= "yellow"
width="1350">
<tr>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="home.html">HOME</a></td>
Page | 40
<td><font color="black" face="Tahoma"><b><CENTER><a
href="about.html">ABOUT</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="admissions.html">ADMISSIONS</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="contact.html">CONTACT US</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="results.html">RESULTS</a></td>
</tr>
</table>
<font color="black" face="Tahoma">
<table border=0px; bgcolor= "FFCC99"width="1350">
<br><th id="name" colspan="4" bgcolor="white">LEAVE
YOUR MESSAGE</th></center>
<tr><td>Your Name</td>
<td><input type="text" name="t1" size="20"></td></tr>
<tr><td>E-mail</td>
<td><input type="text" name="t2" size="20"></td></tr>
<tr><td>Your Message</td>
<td><textarea name="ta" row="80"
cols="80"></textarea><br><br></td></tr>
<th id="name" colspan="4" bgcolor="white">Call Us</th>
<tr>
<td><font size="5" color="black" face="Tahoma">
<ul>
<li>Admission Cell: +91 75993 61707 / 08</li>
<li>Registrar: +91 81712 73114 / +91 94577 35736</li>
<li>Admin Officer: +91 98971 82240</li>
</tr>
<th id="name" colspan="4" bgcolor="white">REACH
US</th>
<tr>
<td><font size="5" color="black" face="Tahoma">
Address: Mohammad Ali Jauhar University, Jauhar
Nagar,Rampur - 244901, U.P., India
</tr>
</TABLE>
<center>
<font color="BLACK" face="Tahoma"
size="3"><br><br><br><br>
<H3>Page Design by MOHD.BILAL</H3>
Page | 41
<h4>Contact: bilalmirza.01@gmail.com</h4>
</body>
</html>
5: Results:
<html>
<head>
<title>Admission form</title>
<body>
<center>
<body bgcolor="FFCC99">
<table><table border=0px; bgcolor= "CC6633"
width="1350" height="200">
<tr>
<td><img src="logo.png" width="150" height"150"></td>
<td><font color="yellow" face="Tahoma"><u>
<h1>MOHAMMAD ALI JAUHAR UNIVERSITY</h1></u>
<font color="white" face="Tahoma">
<h2>Jauhar Nagar, Rampur, U.P., India</h2>
</td></tr></th>
</table>
<table><table border=0px; bgcolor= "yellow"
width="1350">
<tr>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="home.html">HOME</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="about.html">ABOUT</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="admissions.html">ADMISSIONS</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="contact.html">CONTACT US</a></td>
<td><font color="black" face="Tahoma"><b><CENTER><a
href="results.html">RESULTS</a></td>
</tr>
</table>
<font SIZE="6" color="black" face="Tahoma">
<BR><BR>
Even Semester Result Declared
<br><br>
Page | 42
<a
href="http://jauharuniversity.edu.in/results.html">CLI
CK HERE</a> to check the result
</TABLE>
<center>
<font color="BLACK" face="Tahoma"
size="3"><br><br><br><br>
<H3>Page Design by MOHD.BILAL</H3>
<h4>Contact: bilalmirza.01@gmail.com</h4>
</body>
</html>
RESULT: Program executes successfully.

More Related Content

PPT
Introduction to Javascript
PPTX
Introduction to React
PDF
Chapter 02: Classes Objects and Methods Java by Tushar B Kute
PPT
CSS Basics
PPT
Java Persistence API (JPA) Step By Step
PDF
Java Collection framework
PPT
Java Programming for Designers
Introduction to Javascript
Introduction to React
Chapter 02: Classes Objects and Methods Java by Tushar B Kute
CSS Basics
Java Persistence API (JPA) Step By Step
Java Collection framework
Java Programming for Designers

What's hot (20)

PDF
Polymorphism in Java
PPTX
Angular 2.0 forms
PPTX
Spring Security
PPTX
Css selectors
PDF
HTML CSS JS in Nut shell
PDF
Introduction to ReactJS
PPTX
Java string , string buffer and wrapper class
PDF
Spring boot jpa
PPTX
Css tables
PPT
Advanced Cascading Style Sheets
ODP
Introduction to Spring Framework and Spring IoC
PDF
Angular Pipes Workshop
PDF
Le Wagon - Javascript for Beginners
ODP
CSS Basics
PPTX
Css font properties
PPTX
9. ES6 | Let And Const | TypeScript | JavaScript
PDF
Introduzione ad angular 7/8
PPTX
Introduction to JavaScript Basics.
PPTX
Understanding JWT Exploitation
PPTX
Basic HTML
Polymorphism in Java
Angular 2.0 forms
Spring Security
Css selectors
HTML CSS JS in Nut shell
Introduction to ReactJS
Java string , string buffer and wrapper class
Spring boot jpa
Css tables
Advanced Cascading Style Sheets
Introduction to Spring Framework and Spring IoC
Angular Pipes Workshop
Le Wagon - Javascript for Beginners
CSS Basics
Css font properties
9. ES6 | Let And Const | TypeScript | JavaScript
Introduzione ad angular 7/8
Introduction to JavaScript Basics.
Understanding JWT Exploitation
Basic HTML
Ad

Similar to Learn JavaScript HTML & CSS (20)

PDF
30+ Basic HTML Coding Projects for Class 10.pdf
DOCX
Print this
DOCX
Caracteristicas Basicas De Htlm
PPT
Intodcution to Html
PDF
#3 HTML & CSS [know-how]
PPTX
Introduction to HTML+CSS+Javascript.pptx
PDF
Introduction to Bootstrap
PDF
Web technology lab manual
DOCX
Html file
PDF
Html tags describe in bangla
PDF
PDF
Title, heading and paragraph tags
PDF
Introduction to HTML
KEY
Html 5, a gentle introduction
PPTX
Introduction to HTML+CSS+Javascript by Deepu.pptx
KEY
Html5, a gentle introduction
PPTX
計算機概論20161205
PPTX
Internet Based Programming -3-JAVASCRIPT
PPTX
What's new in ASP.NET 4
30+ Basic HTML Coding Projects for Class 10.pdf
Print this
Caracteristicas Basicas De Htlm
Intodcution to Html
#3 HTML & CSS [know-how]
Introduction to HTML+CSS+Javascript.pptx
Introduction to Bootstrap
Web technology lab manual
Html file
Html tags describe in bangla
Title, heading and paragraph tags
Introduction to HTML
Html 5, a gentle introduction
Introduction to HTML+CSS+Javascript by Deepu.pptx
Html5, a gentle introduction
計算機概論20161205
Internet Based Programming -3-JAVASCRIPT
What's new in ASP.NET 4
Ad

More from Bilal Mirza (7)

PPTX
Android Operating System
PDF
Seminar Report on Android OS
PPTX
Android Operating System
PDF
Operating System Lab Manual
PDF
Data Structure using C
PPTX
Environment Problems
PPT
Counters
Android Operating System
Seminar Report on Android OS
Android Operating System
Operating System Lab Manual
Data Structure using C
Environment Problems
Counters

Recently uploaded (20)

PPT
Introduction, IoT Design Methodology, Case Study on IoT System for Weather Mo...
PPTX
6ME3A-Unit-II-Sensors and Actuators_Handouts.pptx
PDF
null (2) bgfbg bfgb bfgb fbfg bfbgf b.pdf
PDF
Exploratory_Data_Analysis_Fundamentals.pdf
PDF
SMART SIGNAL TIMING FOR URBAN INTERSECTIONS USING REAL-TIME VEHICLE DETECTI...
PPT
INTRODUCTION -Data Warehousing and Mining-M.Tech- VTU.ppt
PPTX
MET 305 2019 SCHEME MODULE 2 COMPLETE.pptx
PPTX
CURRICULAM DESIGN engineering FOR CSE 2025.pptx
PDF
Categorization of Factors Affecting Classification Algorithms Selection
PDF
PREDICTION OF DIABETES FROM ELECTRONIC HEALTH RECORDS
PDF
Automation-in-Manufacturing-Chapter-Introduction.pdf
PPT
A5_DistSysCh1.ppt_INTRODUCTION TO DISTRIBUTED SYSTEMS
PDF
86236642-Electric-Loco-Shed.pdf jfkduklg
PPTX
Fundamentals of Mechanical Engineering.pptx
PDF
Human-AI Collaboration: Balancing Agentic AI and Autonomy in Hybrid Systems
PDF
Enhancing Cyber Defense Against Zero-Day Attacks using Ensemble Neural Networks
PDF
Integrating Fractal Dimension and Time Series Analysis for Optimized Hyperspe...
PDF
PPT on Performance Review to get promotions
PDF
keyrequirementskkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk
PPTX
Nature of X-rays, X- Ray Equipment, Fluoroscopy
Introduction, IoT Design Methodology, Case Study on IoT System for Weather Mo...
6ME3A-Unit-II-Sensors and Actuators_Handouts.pptx
null (2) bgfbg bfgb bfgb fbfg bfbgf b.pdf
Exploratory_Data_Analysis_Fundamentals.pdf
SMART SIGNAL TIMING FOR URBAN INTERSECTIONS USING REAL-TIME VEHICLE DETECTI...
INTRODUCTION -Data Warehousing and Mining-M.Tech- VTU.ppt
MET 305 2019 SCHEME MODULE 2 COMPLETE.pptx
CURRICULAM DESIGN engineering FOR CSE 2025.pptx
Categorization of Factors Affecting Classification Algorithms Selection
PREDICTION OF DIABETES FROM ELECTRONIC HEALTH RECORDS
Automation-in-Manufacturing-Chapter-Introduction.pdf
A5_DistSysCh1.ppt_INTRODUCTION TO DISTRIBUTED SYSTEMS
86236642-Electric-Loco-Shed.pdf jfkduklg
Fundamentals of Mechanical Engineering.pptx
Human-AI Collaboration: Balancing Agentic AI and Autonomy in Hybrid Systems
Enhancing Cyber Defense Against Zero-Day Attacks using Ensemble Neural Networks
Integrating Fractal Dimension and Time Series Analysis for Optimized Hyperspe...
PPT on Performance Review to get promotions
keyrequirementskkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk
Nature of X-rays, X- Ray Equipment, Fluoroscopy

Learn JavaScript HTML & CSS

  • 1. Page | 1 PROGRAM: 1 AIM: Program to perform all tags in HTML. ALGORITHM: 1. Create <html> tag 2. Create <head> tag 3. Add Title using <title> tag & enclose it with </title> tag. 4. Define <body> tag to determine the main content of HTML doc. 5. Define a <p> paragraph tag to add a paragraph in HTML doc, 6. Enclose it with closing </p> tag. 7. Define <h1> tag to create Headings in HTML doc, 8. And enclose it with closing </h1> tag. 9. Define <img src=”ImageUrl.jpg”/> to add images in HTML doc, 10. Define <a href=”Link”> to add a link on text or image in HTML doc, 11. Enclose it with closing </a> tag. 12. Define <br> Line Break tag to insert a Single line break. 13. Define <ul> tag to define Unordered List. To add elements in a list we have to define <li> i.e. List item tags to add items in a list. 14. Enclose it with closing </ul> tag. 15. Define <ol> tag to define Ordered List. To add elements in a list we have to define <li> i.e. List item tags to add items in a list. 16. Enclose it with closing </ol> tag. 17. To add a table in HTML doc. we need to define a <table> tag, <tr> tag for adding rows in a table & <td> to add the Data in table row. CODING: 1: HTML Paragraph Tag: <html> <head> <title>Paragraph</title> </head> <body> <p> This is first Paragraph </p> </body> </html>
  • 2. Page | 2 2: HTML Heading Tag: <html> <head> <title>Heading</title> </head> <body> <h1> This is first heading </h1> <h2> This is Second heading </h2> </body> </html> 3: HTML Image Tag: <html> <head> <title>Image</title> </head> <body> <img src="logo.jpg" width="380" height="70" /> </body> </body> </html> 4: HTML Link Tag: <html> <head> <title>Link</title> </head> <body> <a href="http://www.google.com"> Click here!! </a> </body> </body> </html>
  • 3. Page | 3 5: HTML Line Break Tag: <html> <head> <title>Break tag</title> </head> <body> <p>Hello<br> Hi<br> How are you? <br> </p> </body> </body> </html> 6: HTML Unordered List Tag: <html> <head> <title>Unordered List</title> </head> <body> <ul> <li>Coffee</li> <li>Milk</li> <li>Tea</li> </ul> </body> </body> </html> 7: HTML Ordered List Tag: <html> <head> <title>Ordered List</title> </head> <body> <ol> <li>Coffee</li> <li>Milk</li>
  • 4. Page | 4 <li>Tea</li> </ol> </body> </body> </html> 8: HTML Table Tag: <html> <head> <title>Table</title> </head> <body> <table border=”1”> <tr> <td>Row 1, Cell 1 </td> <td>Row 2, Cell 2 </td> </tr> <table> </body> </body> </html> RESULT: Program executes successfully.
  • 5. Page | 5 PROGRAM: 2 AIM: To implement webpage for Feedback Form. ALGORITHM: 1. <form action="URL to form script" method="POST"> 2. Your Name: <br> 3. <input type="text" name="realname"><br> 4. <br> 5. Your email: <br> 6. <input type="text" name="email"><br> 7. <br> 8. Your Feedback: <br> 9. <textarea name="comments" rows="15" cols="50"></textarea><br><br> 10. <input type="submit" value="Submit"> 11. </form> CODING: <html> <body bgcolor= "pink"> <center> <font color="blue"> <h1>FEEDBACK FORM</h1> </center> <form method="get" onsubmit="validate()"> <center> <table border=10px; bgcolor= "orange"> <center><th id="name" colspan="2" bgcolor="aqua">ENTER YOUR DETAILS BELOW</th></center> <tr><td>First Name</td> <td><input type="text" name="t5" size="20"></td></tr> <tr><td>Last Name</td> <td><input type="text" name="t6" size="20"></td></tr> <tr><td>Date of Birth</td> <td><input type="text" name="t7" size="1"> / <input type="number" name="t8" size="4"> / <input type="number" name="t9" size="2">
  • 6. Page | 6 </td></tr> <tr><td>Enrollment no.</td> <td><input type="text" name="t2" maxlength"10"></td></tr> <tr><td>Gender</td> <td> <input type="radio" value="Male" name="r1">Male</br> <input type="radio" value="female" name="r1">Female</td></tr> <tr><td>Course</td> <td><select name="s1"> <option value="B tech">B tech</option> <option value="BCA">BCA</option> <option value="M tech">M tech</option> <option value="MCA">MCA</option> </option></select></td></tr> <tr><td>Subject</td> <td><textarea name="ta" row="20" cols="20"></textarea></td></tr> <tr> <td align="center" colspan="2"><input type="Submit" value="Submit" onclick="return submitData();"> <input type="reset"></td></tr> </table> </center> </form> </body> </html> RESULT: Program executes successfully.
  • 7. Page | 7 PROGRAM: 3 AIM: To implement webpage Employment detail in HTML ALGORITHM: 1. Create <HTML> tag. 2. Use <center> tag for alignment of text in center. 3. Create a form method by using <form method="get"onsubmit="validate()"> 4. Create <table> tag and insert the data which you want to add in the table in its rows. i.e.: 5. <tr> 6. <td> INSERT ELEMENTS </td> 7. </tr> 8. Add input fields by using: <input type="text"first name="t1" size="20"> 9. Add Radio Buttons by using: <input type="radio" value="Male" name="r1">Male 10. Close the </table> tag. 11. Close the </form> tag. 12. Close </html> tag. CODING: <html> <center> <h1>EMPLOYMENT DETAILS FORM </h1> </center> <body bgcolor= "cyan"> <CENTER> <form method="get"onsubmit="validate()"> <table border=8px; bgcolor= "pink"> <fontface="Century Gothic" font color="white"> <th id="name" colspan="2" bgcolor="WHITE">ENTER DETAILS</th> <tr><td>Enter first Name</td> <td><input type="text"first name="t1" size="20"></td></tr> <tr><td>Enter last Name</td> <td><input type="text"last name="t1" size="20"></td></tr>
  • 8. Page | 8 <tr><td>Date Of Birth</td> <td><input type="text"Date Of Birth="t1" size="20"></td></tr <tr><td>Sexcode</td> <td><input type="radio" value="Male" name="r1">Male</br> <input type="radio" value="female" name="r1">Female</td></tr> <tr><td>Email Address</td> <td><input type="text" name="email" maxlength="30" size="30"></td></tr> <tr><td>Home Address</td> <td><textarea name="ta" row="10" cols="20"></textarea></td></td> <tr><td>Telephone Number</td> <td><input type="text" name="telephone" maxlength="30" size="30"></td></tr> <tr><td>Qualification</td> <td><select name="s1"> <option value="B tech">B tech</option> <option value="M tech">M tech</option> <option value="MBA">MBA</option> <option value="MCA">MCA</option> <option value="Hotel Management">Hotel Management</option> <option value="P Hd">P Hd</option> <option value="Other">Other</option> </select></td></tr> <tr><td>Resume</td> <td><textarea name="ta" row="10" cols="30"></textarea></td></tr> <tr><td align="center" colspan="2"><input type="Submit" value="Submit" onclick="return submitData();"> <input type="reset"></td></tr> </table> </form> </body> </html> RESULT: Program executes successfully.
  • 9. Page | 9 PROGRAM: 4 AIM: To find maximum of three numbers using Java Script. ALGORITHM: 1. Create <HTML> tag. 2. Add <script type=”text/JavaScript”> for using Java Script. 3. Input the values of three numbers i.e. a,b & c. 4. Convert these input values into integer values by: a=parseInt(a); 5. Compare the values by using if else Condition Statements. 6. if(a>b && a>c) 7. Print “Greatest number: a”. 8. if(b>a && b>c) 9. Print “Greatest number: b”. 10. if(c>a && c>b) 11. Print “Greatest number: c”. 12. Close </script> tag. 13. Close </HTML> tag. CODING: <html> <head> <title>largest number</title> <script language="JavaScript"> a=prompt("Enter first number:"); b=prompt("Enter first number:"); c=prompt("Enter first number:"); a=parseInt(a); b=parseInt(b); c=parseInt(c); if(a>b && a>c) { document.write("<h1>Greatest Number is:"+a); } else if(b>a && b>c) {
  • 10. Page | 10 document.write("<h1>Greatest Number is:"+b); } else if(c>a && c>b) { document.write("<h1>Greatest Number is:"+c); } </script> </body> RESULT: Program executes successfully.
  • 11. Page | 11 PROGRAM: 5 AIM: To perform Bubble Sort & Binary Search using Java Script. 1: Bubble Sort: ALGORITHM: 1. Create <HTML> tag. 2. Add <script type=”text/JavaScript”> for using Java Script. 3. Insert the Elements of array i.e. 4. var array = new Array(15,23,1,69,45,36,7,64,99,5); 5. Create variables “I”, “j” & “k”. 6. Execute for loop: 7. for(i=0;i<arrayLength;i++) 8. { 9. for(j=i+1;j<arrayLength;j++) 10. { 11. if(array[i]<array[j]) 12. { 13. k=array[i]; 14. array[i]=array[j]; 15. array[j]=k; 16. } 17. } 18. } 19. Print the Sorted Array. CODING: <html> <head> <script type="text/javascript"> var array = new Array(15,23,1,69,45,36,7,64,99,5); document.write("Array is "+ array); var arrayLength = array.length; var i; var j; var k;
  • 12. Page | 12 for(i=0;i<arrayLength;i++) { for(j=i+1;j<arrayLength;j++) { if(array[i]<array[j]) { k=array[i]; array[i]=array[j]; array[j]=k; } } } document.write("<br/>After bubble sort in desending order " + array); </script> </head> <body> </body> </html> RESULT: Program executes successfully.
  • 13. Page | 13 2: Binary Search: ALGORITHM: 1. Create <HTML> tag. 2. Add <script type=”text/JavaScript”> for using Java Script. 3. Input the values of size , elements and the item to be searched. 4. function binaryIndexOf(searchElement) { 'use strict'; 5. var minIndex = 0; 6. var maxIndex = this.length - 1; 7. var currentIndex; 8. var currentElement; 9. while (minIndex <= maxIndex) { 10. currentIndex = (minIndex + maxIndex) / 2 | 0; 11. currentElement = this[currentIndex]; 12. 13. if (currentElement < searchElement) { 14. minIndex = currentIndex + 1; 15. } 16. else if (currentElement > searchElement) { 17. maxIndex = currentIndex - 1; 18. } 19. else { 20. return currentIndex; 21. } 22. } 23. 24. return -1; 25. } 26. Close </script> & <HTML> tag. CODING: <html> <head> <title>Binary Search</title> <script type="text/javascript">
  • 14. Page | 14 function binary() { var n=parseInt(prompt("enter the size of an array: ")); var a=new Array(n); var p=0; for(var i=0;i<a.length;i++) { a[i]=parseInt(prompt("enter array elements")); } for(var i=0;i<a.length;i++) { for(var j=i+1;j<a.length;j++) { if(a[i]>a[j]) { var t=a[i]; a[i]=a[j]; a[j]=t; } } } var k=parseInt(prompt("enter the key element ")); var i=0; var u=parseInt(a.length-1); while(i<=u) { var m=parseInt((i+u)/2); if(k==a[m]) { p=1; break; } else if(k>a[m]) { i=m+1; } else if(k<a[m]) { u=m-1; } } if(p==1) document.writeln("element found at :"+m);
  • 15. Page | 15 else document.writeln("element not found"); } </script> </head> <body onLoad="binary();"></body> </html> RESULT: Program executes successfully.
  • 16. Page | 16 PROGRAM: 6 AIM: To create Coconut tree in applet. ALGORITHM: 1. Import Java applet 2. Create a class which extends Applet class 3. Create a public function : public void paint (Graphics g) 4. Set the color of element you wants to add by: 5. g.setColor(Color.red) 6. Create the element by determining its shape: 7. g.fillRect(10,20,30,40) CODING: import java.applet.*; import java.awt.*; public class tree extends Applet { public void paint(Graphics g) { g.setColor(Color.black); g.drawString("COCONUT TREE",200,50); g.drawArc(120,100,50,300,130,120); g.drawArc(140,100,50,300,130,120); g.drawArc(110,90,50,250,0,150); g.drawArc(140,90,50,300,20,140); g.drawArc(105,35,50,300,30,110); g.drawOval(150,110,20,30); g.drawOval(130,110,20,30); g.drawOval(140,120,20,30); g.drawLine(125,155,145,155); g.drawLine(120,200,140,200);
  • 18. Page | 18 PROGRAM: 7 AIM: To perform simple TCP/IP Client-Server chat application using java. ALGORITHM: 1. Import java i/o files. 2. Import java .net files. 3. Create a class GossipClient 4. Declare a main function 5. public static void main(String[ ]args) 6. Create a socket inside throw exception. 7. Add : 8. Buffer Reader ( ) 9. Input Stream Reader( ) 10. Output Stream Reader( ) 11. Print writer( ) 12. Apply Condition Statements 13. Print the Results. CODING: 1: For Client: import java.io.*; import java.net.*; public class GossipClient { public static void main(String[]args) throws Exception { Socket sock = new Socket("localhost",6789); BufferedReader keyRead = new BufferedReader(new InputStreamReader(System.in)); OutputStream ostream = sock.getOutputStream(); PrintWriter pwrite = new PrintWriter(ostream, true); InputStream istream = sock.getInputStream(); BufferedReader receiveRead = new BufferedReader(new InputStreamReader(istream)); System.out.println("Start the chitchat, type and press Enter key");
  • 19. Page | 19 String receiveMessage,sendMessage; while(true) { sendMessage = keyRead.readLine(); pwrite.println(sendMessage); System.out.flush(); if((receiveMessage=receiveRead.readLine())!=null) { System.out.println(receiveMessage); } } } } 2: For Server: import java.io.*; import java.net.*; public class GossipServer { public static void main(String args[]) throws Exception { ServerSocket sersock = new ServerSocket(6789); System.out.println("Server ready for chatting"); Socket sock = sersock.accept(); BufferedReader keyRead = new BufferedReader(new InputStreamReader(System.in)); OutputStream ostream = sock.getOutputStream(); PrintWriter pwrite = new PrintWriter(ostream, true); InputStream istream = sock.getInputStream(); BufferedReader receiveRead = new BufferedReader(new InputStreamReader(istream)); String receiveMessage,sendMessage; while(true) { if((receiveMessage = receiveRead.readLine()) != null) { System.out.println(receiveMessage); }
  • 20. Page | 20 sendMessage = keyRead.readLine(); pwrite.println(sendMessage); System.out.flush(); } } } RESULT: Program executes successfully.
  • 21. Page | 21 PROGRAM: 8 AIM: To perform operation on Employee table using JDBC Connectivity. ALGORITHM: 1. Loading the Drivers: 2. Class.forName() 3. DriverManager.registerDriver() 4. Create the Connections 5. Create the statement. 6. Execute the Query. 7. Close the Connection. CODING: import java.sql.*; class EmployeeRecord { public static final String DBURL = "jdbc:oracle:thin:@localhost:1521:XE"; public static final String DBUSER = "local"; public static final String DBPASS = "test"; public static void main(String args[]) { try { //Loading the driver Class.forName("oracle.jdbc.driver.Oracl eDriver"); //Cretae the connection object Connection con = DriverManager.getConnection(DBURL, DBUSER, DBPASS); //Insert the record String sql = "INSERT INTO emp (emp_id, empname, email, city) VALUES (?, ?, ?, ?)"; PreparedStatement statement = con.prepareStatement(sql); statement.setInt(1, 100); statement.setString(2, "Prashant");
  • 22. Page | 22 statement.setString(3, "[email protected]"); statement.setString(4, "Pune"); int rowsInserted = statement.executeUpdate(); if (rowsInserted > 0) { System.out.println("A new employee was inserted successfully!n"); } // Display the record String sql1 = "SELECT * FROM Emp"; Statement stmt = con.createStatement(); ResultSet result = stmt.executeQuery(sql1); while (result.next()) { System.out.println (result.getInt(1)+" "+ result.getString(2)+" "+ result.getString(3)+" "+ result.getString(4)); } //Update the record String sql2 = "Update Emp set email = ? where empname = ?"; PreparedStatement pstmt = con.prepareStatement(sql2); pstmt.setString(1, "[email protected]"); pstmt.setString(2, "Jaya"); int rowUpdate = pstmt.executeUpdate(); if (rowUpdate > 0) { System.out.println("nRecord updated successfully!!n"); } //Delete the record
  • 23. Page | 23 String sql3 = "DELETE FROM Emp WHERE empname=?"; PreparedStatement statement1 = con.prepareStatement(sql3); statement1.setString(1, "Prashant"); int rowsDeleted = statement1.executeUpdate(); if (rowsDeleted > 0) { System.out.println("A Employee was deleted successfully!n"); } } catch(Exception ex) { ex.printStackTrace(); } } } RESULT: Program executes successfully.
  • 24. Page | 24 PROGRAM: 9 AIM: To create a Personal Webpage using HTML & CSS ALGORITHM: 1. Create <HTML> tag 2. Add Title <title> tag 3. Create first Division (DIV) by using CSS Property : 4. .CONT{ 5. POSITION:fixed; 6. TOP:1; 7. WIDTH:330; 8. HEIGHT:1350; 9. BACKGROUND-COLOR:#424242; 10. box-shadow: 8px 8px 5px #888888; 11. } 12. Create Second Div : 13. .CONT2{ 14. POSITION:ABSOLUTE; 15. TOP:1; 16. LEFT:350; 17. WIDTH:1000; 18. HEIGHT:1350; 19. BACKGROUND-COLOR:#FCFFD5 ; 20. COLOR:WHITE; 21. } 22. Create <body> of the program. 23. Add the declaration of first Division by: 24. <DIV CLASS=CONT> and add the elements you wants to add inside it. 25. Close it by using </div> tag 26. Add the declaration of Second Division by: 27. <DIV CLASS=CONT2> and add the elements you wants to add inside it. 28. Close it by using </div> tag 29. Close </body> and </html> tag. CODING: <html> <head>
  • 25. Page | 25 <title>Webpage</title> <style> .CONT{ POSITION:fixed; TOP:1; WIDTH:330; HEIGHT:1350; BACKGROUND-COLOR:#424242; box-shadow: 8px 8px 5px #888888; } .CONT2{ POSITION:ABSOLUTE; TOP:1; LEFT:350; WIDTH:1000; HEIGHT:1350; BACKGROUND-COLOR:#FCFFD5 ; COLOR:WHITE; } #p0{ POSITION:RELATIVE; TOP:1; LEFT:600; } .head1{ POSITION:relative; TOP:10; WIDTH:950; HEIGHT:40; BACKGROUND-COLOR:brown; COLOR:WHITE; box-shadow: 5px 5px 5px #888888; } #p1{ POSITION:RELATIVE; TOP:1; LEFT:10; } .head2{ POSITION:relative; TOP:90; WIDTH:950; HEIGHT:40; BACKGROUND-COLOR:brown; COLOR:WHITE; box-shadow: 5px 5px 5px #888888; } #p2{
  • 26. Page | 26 POSITION:RELATIVE; TOP:1; LEFT:10; } .head3{ POSITION:relative; TOP:200; WIDTH:950; HEIGHT:40; BACKGROUND-COLOR:brown; COLOR:WHITE; box-shadow: 5px 5px 5px #888888; } #p3{ POSITION:RELATIVE; TOP:1; LEFT:10; } .head4{ POSITION:relative; TOP:420; WIDTH:950; HEIGHT:40; BACKGROUND-COLOR:brown; COLOR:WHITE; box-shadow: 5px 5px 5px #888888; } #p4{ POSITION:RELATIVE; TOP:1; LEFT:10; } .head5{ POSITION:relative; TOP:600; WIDTH:950; HEIGHT:40; BACKGROUND-COLOR:brown; COLOR:WHITE; box-shadow: 5px 5px 5px #888888; } #p5{ POSITION:RELATIVE; TOP:1; LEFT:10; } .head6{ POSITION:relative;
  • 27. Page | 27 TOP:740; WIDTH:950; HEIGHT:40; BACKGROUND-COLOR:brown; COLOR:WHITE; box-shadow: 5px 5px 5px #888888; } #p6{ POSITION:RELATIVE; TOP:1; LEFT:10; } div span, div img { display: inline-block; vertical-align: middle; } </STYLE></HEAD> <BODY> <DIV CLASS=CONT> <br><center><br><br> <img src="image.jpg" height="150" width="150"> <font color="white" face="Century Gothic"> <h1>BILAL MIRZA</h1></center> <left> <font color="#FAF1A1" size="5"><br>&nbsp;&nbsp;&nbsp;SOCIAL PROFILE <font color="white" face="Calibri" size="5"><br> &nbsp;&nbsp;&nbsp;<img src="facebook.png" height="40" width="40"><span> &nbsp;<a href="https://www.facebook.com/bilal.mirza.146"><font color="#FCFFD5">/bilal.mirza.146</a></span><br> &nbsp;&nbsp;&nbsp;<img src="insta.png" height="40" width="40"><span>&nbsp;<a href="https://www.instagram.com/bilal_mirza_/"><font color="#FCFFD5">@bilal_mirza_</a></span><br> &nbsp;&nbsp;&nbsp;<img src="twitter.png" height="40" width="40"><span>&nbsp;<a href="https://twitter.com/bilalmirza_"><font color="#FCFFD5">@bilalmirza_</a></span><br> &nbsp;&nbsp;&nbsp;<img src="google.png" height="40" width="40"><span>&nbsp;<a href="https://plus.google.com/106644495743037247927"><font color="#FCFFD5">/bilalmirza.01</a></span><br><br><BR><br><br> <font color="white" face="Calibri" size="3"> &nbsp;Design By: BILAL MIRZA </DIV> <DIV CLASS=CONT2>
  • 28. Page | 28 <p ID=P0><font color="BLACK" face="Century Gothic" size="5">PERSONAL PROFILE / RESUME</P> <DIV CLASS=head1> <font color="white" face="Century Gothic" size="5"> <p ID=p1>OBJECTIVE <br><font color="black" face="Calibri" size="5"><br> To serve a responsible position in your organisization where the company can utilize my abilities to the maximum. I can grow professionally as well as financially at the same time. </p> </div> <DIV CLASS=head2> <font color="white" face="Century Gothic" size="5"> <p ID=p2>EDUCATION <br><font color="black" face="Calibri" size="5"> <UL> <li>Pursuing <font color="brown"><I>Computer Science Engineering </I> <font color="black"> from Mohammad Ali Jauhar University, Rampur</li> <li>Intermidiate with 68% from Stepping Stones School, Muzaffarnagar.</li> <li>High School with 65% from Stepping Stones School, Muzaffarnagar.</li></ul> </p> </div> <DIV CLASS=head3> <font color="white" face="Century Gothic" size="5"> <p ID=p3>Personal Info <br><font color="black" face="Calibri" size="5"> <UL> <li>Full Name : <i>Muhammad Bilal Mirza</i></li> <li>Father's Name : <i>Mr. Saleem Ahmad</i></li> <li>Date of Birth : <i>12/04/1997</i></li> <li>Gender : <i>Male</i></li> <li>Nationality : <i>Indian</i></li> <li>Religion : <i>Islam</i></li> <li>Blood Group : <i>AB+</i></li> </ul> </p> </div> <DIV CLASS=head4> <font color="white" face="Century Gothic" size="5"> <p ID=p4>Hobbies <br><font color="black" face="Calibri" size="5"> <UL>
  • 29. Page | 29 <li>Programming</li> <li>Computing</i></li> <li>Learning New Things</i></li> <li>Reading</li> <li>Photography</li> </ul> </p> </div> <DIV CLASS=head5> <font color="white" face="Century Gothic" size="5"> <p ID=p5>Computer Languages <br><font color="black" face="Calibri" size="5"> <UL> <li>HTML 5</li> <li>Java Script</i></li> <li>Java</i></li> <li>C++</li> </ul> </p> </div> <DIV CLASS=head6> <font color="white" face="Century Gothic" size="5"> <p ID=p6>Contact Me <br><font color="black" face="Calibri" size="5"> <UL> <li>Phone: <i>&nbsp;+91-8791314025</i></li> <li>E-Mail:<i>&nbsp;[email protected]</i></li> <li>Website: <i>&nbsp;www.mdbilalmirza.webs.com</i></li> <li>Address:<i>&nbsp;Mehmood Nagar, Muzaffarnagar</i></li> </ul> </p> </div> </DIV> </BODY> </HTML> RESULT: Program executes successfully.
  • 30. Page | 30 PROGRAM: 10 AIM: To create a webpage for university using HTML. ALGORITHM: 1. Create <HTML> tag. 2. Add background color; <body bgcolor=”red”> 3. Define a table by using <table> tag. 4. Add the contents in the table i.e. the Logo and the Title. 5. Create another table and add the links of other pages into it. i.e. Home, About, Admission, Contact us, Results. 6. Add links of these pages by <a href=”home.html”>HOME</a> 7. Create a paragraph to write the contents <p> 8. Add image by using <img src=”image.jpg”> tag 9. Add the elements according to your requirements. CODING: 1:Home page: <html> <head> <title>Admission form</title> <body> <center> <body bgcolor="FFCC99"> <table><table border=0px; bgcolor= "CC6633" width="1350" height="200"> <tr> <td><img src="logo.png" width="150" height"150"></td> <td><font color="yellow" face="Tahoma"><u> <h1>MOHAMMAD ALI JAUHAR UNIVERSITY</h1></u> <font color="white" face="Tahoma"> <h2>Jauhar Nagar, Rampur, U.P., India</h2> </td></tr></th> </table> <table><table border=0px; bgcolor= "yellow" width="1350"> <tr>
  • 31. Page | 31 <td><font color="black" face="Tahoma"><b><CENTER><a href="home.html">HOME</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="about.html">ABOUT</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="admissions.html">ADMISSIONS</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="contact.html">CONTACT US</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="results.html">RESULTS</a></td> </tr> </table> <br><br> <table><table border=0px; bgcolor= "FFCC99" width="1350"> <tr> <td> <font size="6" color="RED" face="Tahoma"><B> WELCOME<BR></B> <font size="4" color="black" face="Tahoma"> The Mohammad Ali Jauhar University situatied at Rampur is one of the best institution which provides quality education, The university was establish by Ex-Cabinet Minister Mohammad Azam Khan. Mohammad Ali Jauhar University, Rampur was established in the year 2006 by an Act of State Legislature of Uttar Pradesh. It is approximately 12 km from Rampur Railway Station. The University caters courses in various streams of Science, Humanities, Law, Education, Commerce, Engineering & Technology, Paramedical Sciences including Nursing, Mass Communication and Agriculture and is almost prepare to start a Medical College named as Jauhar Institute of Medical Sciences (JIMS). </td> <td><img src="img.jpg" width="400" height="250"></td> </tr> <tr><td> <ul><li><font size="5" color="black" face="Tahoma"> HIGHEST ORDER
  • 32. Page | 32 <br> Our objective is to impart multidisciplinary education at UG/PG and PhD level of excellent level. </td> <tr><td> <ul><li><font size="5" color="black" face="Tahoma"> RANKING <br> Mohammad Ali Jauhar University has been placed at high rank among Indian private universities by several magazines and newspapers. </td> <tr><td> <ul><li><font size="5" color="black" face="Tahoma"> SKILLED FACULTY <br> Excellent faculty as per UGC norms is the criteria of induction. Devoted and dedicated faculty who not only interact with the students in the classrooms but beyond the classrooms to enthuse them for the pursuit of knowledge in their subjects of study, consciousness about the environment and their social responsibilities is our trade mark. </td> </table> <center> <font color="BLACK" face="Tahoma"> <font color="BLACK" face="Tahoma" size="3"><br><br><br><br> <H3>Page Design by MOHD.BILAL</H3> <h4>Contact: [email protected]</h4> </body> </html> 2:About: <html> <head> <title>Admission form</title> <body>
  • 33. Page | 33 <center> <body bgcolor="FFCC99"> <table><table border=0px; bgcolor= "CC6633" width="1350" height="200"> <tr> <td><img src="logo.png" width="150" height"150"></td> <td><font color="yellow" face="Tahoma"><u> <h1>MOHAMMAD ALI JAUHAR UNIVERSITY</h1></u> <font color="white" face="Tahoma"> <h2>Jauhar Nagar, Rampur, U.P., India</h2> </td></tr></th> </table> <table><table border=0px; bgcolor= "yellow" width="1350"> <tr> <td><font color="black" face="Tahoma"><b><CENTER><a href="home.html">HOME</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="about.html">ABOUT</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="admissions.html">ADMISSIONS</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="contact.html">CONTACT US</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="results.html">RESULTS</a></td> </tr> </table> <font SIZE="5" color="black" face="Tahoma"> <BR> WELCOME TO<br><font color="red" size="8"><b> JAUHAR UNIVERSITY</b> <br><font color="black" size="4"></center><ul><li> Mohammad Ali Jauhar University, Rampur was established in the year 2006 by an Act of State Legislature of Uttar Pradesh. It is approximately 12 km from Rampur Railway Station. The University caters courses in various streams of Science, Humanities, Law, Education, Commerce, Engineering & Technology, Paramedical Sciences including Nursing, Mass Communication and Agriculture and is almost prepare to
  • 34. Page | 34 start a Medical College named as Jauhar Institute of Medical Sciences (JIMS). </li><br><li>The University campus is spread over more than 350 acres and has vast lush green, health sustaining and beautiful landscapes. The bio- aesthetics is further enhanced with the presence of a very huge water body – a source of rich floral and faunal diversity. Ultra modern infrastructure designed by eminent architects is the signature of its beauty. The tranquil ambience of the premises creates the ideal environment for serious study. </li><br><li>Stress is also being given on physical fitness of the students and for this the University has paid adequate attention on promotion of sports on campus. A huge, well-equipped, hi-tech gymnasium with indoor games facilities, viz. badminton, chess, carom, table tennis and outdoor games like football, hockey, cricket, lawn tennis, volleyball, horse riding etc. have been created. National and state level sport competitions are periodically organized by the University. Along with this a stadium with latest facilities is also underway on completion to promote sports with studies. The objective of the University is to mark excellence in its academic programs and sports. The University is committed to its social mission of making education possible to sons and daughters of persons of the down- trodden sections of the society and Muslim minority as well. </ul></li> </TABLE> <center> <font color="BLACK" face="Tahoma" size="3"><br><br><br><br> <H3>Page Design by MOHD.BILAL</H3> <h4>Contact: [email protected]</h4> </body> </html>
  • 35. Page | 35 3:Admissions: <html> <head> <title>Admission form</title> <body> <center> <body bgcolor="FFCC99"> <table><table border=0px; bgcolor= "CC6633" width="1350" height="200"> <tr> <td><img src="logo.png" width="150" height"150"></td> <td><font color="yellow" face="Tahoma"><u> <h1>MOHAMMAD ALI JAUHAR UNIVERSITY</h1></u> <font color="white" face="Tahoma"> <h2>Jauhar Nagar, Rampur, U.P., India</h2> </td></tr></th> </table> <table><table border=0px; bgcolor= "yellow" width="1350"> <tr> <td><font color="black" face="Tahoma"><b><CENTER><a href="home.html">HOME</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="about.html">ABOUT</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="admissions.html">ADMISSIONS</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="contact.html">CONTACT US</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="results.html">RESULTS</a></td> </tr> </table> <font color="black" face="Tahoma"> <table border=0px; bgcolor= "FFCC99"width="1350"> <br><th id="name" colspan="4" bgcolor="white">ENTER YOUR DETAILS BELOW</th></center> <tr><td>First Name</td> <td><input type="text" name="t1" size="20"></td></tr> <tr><td>Last name</td> <td><input type="text" name="t2" size="20"></td></tr> <tr><td>Father's Name</td>
  • 36. Page | 36 <td><input type="text" name="t1" size="20"></td></tr> <tr><td>Mother's Name</td> <td><input type="text" name="t2" size="20"></td></tr> <tr><td>Date of Birth</td> <td><select name="s1"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> <select name="s2"> <option value="Jan">Jan</option> <option value="Feb">Feb</option> <option value="March">March</option>
  • 37. Page | 37 <option value="April">April</option> <option value="May">May</option> <option value="June">June</option> <option value="July">July</option> <option value="Aug">Aug</option> <option value="Sept">Sept</option> <option value="Oct">Oct</option> <option value="Nov">Nov</option> <option value="Dec">Dec</option> </select> <select name="s3"> <option value="1993">1993</option> <option value="1994">1994</option> <option value="1995">1995</option> <option value="1996">1996</option> <option value="1997">1997</option> <option value="1998">1998</option> <option value="1999">1999</option> <option value="2000">2000</option> <option value="2000">2000</option> </select> </td></tr> <tr><td>Gender</td> <td><input type="radio" value="Male" name="r1">Male</br> <input type="radio" value="female" name="r1">Female</td></tr> <tr><td>Mobile No.:</td> <td><input type="number" name="t3" size="10"></td></tr> <tr><td>Select Category</td> <td><select name="s6"> <option value="Minority">Minority</option> <option value="OBC">OBC</option> <option value="General">General</option> <option value="SC/ST">SC/ST</option> </select></td></tr> <th id="name" colspan="2" bgcolor="white">ENTER YOUR ACADEMIC DETAILS</th> <tr><td>Class 10th Marks</td> <td><input type="text" name=t4" size="3"> %</td></tr>
  • 38. Page | 38 <tr><td>Class 12th Marks</td> <td><input type="text" name=t5" size="3"> %</td></tr> <tr><td>Lats year Qualified exam marks </td> <td><input type="text" name=t4" size="3"> %</td></tr> <th id="name" colspan="2" bgcolor="white">COURSE DETAILS</th> <tr><td>Select Course</td> <td><select name="s4"> <option value="B.tech">B.tech</option> <option value="BCA">BCA</option> <option value="Diploma">Diploma</option> <option value="B.com">B.com</option> <option value="BBA">BBA</option> <option value="B.sc">B.sc</option> <option value="B.Pharma">B.Pharma</option> </select></td></tr> <tr><td>Select Branch(if any)</td> <td><select name="s5"> <option value="Computer Science">Computer Science</option> <option value="Civil">Civil</option> <option value="Mechinical">Mechinical</option> <option value="Electrical">Electrical</option> <option value="Electronics">Electronics</option> <option value="Bio-Chemistry">Bio-Chemistry</option> <option value="Zoology">Zoology</option> <option value="Botany">Botany</option> <option value="Physics">Physics</option> <option value="None">None</option> </select></td></tr> <th id="name" colspan="2" bgcolor="white">HOSTEL DETAILS</th> <tr><td>Hostel Required</td> <td><input type="radio" value="Yes" name="r2">Yes <input type="radio" value="No" name="r2"> No</td></tr> <tr><td>Hostel Category</td> <td><input type="radio" value="AC" name="r3">AC <input type="radio" value="Non AC" name="r3"> Non AC</td></tr> <tr>
  • 39. Page | 39 <td><br><b><input type="checkbox" value="correct" name="r4">I Herby declare that the information provided by me are correct</td> </tr> <tr><td align="center" colspan="2"><input type="Submit" value="Submit" onclick="return submitData();"> <input type="reset"></td></tr> </TABLE> <center> <font color="BLACK" face="Tahoma" size="3"><br><br><br><br> <H3>Page Design by MOHD.BILAL</H3> <h4>Contact: [email protected]</h4> </body> </html> 4: Contact Us: <html> <head> <title>Admission form</title> <body> <center> <body bgcolor="FFCC99"> <table><table border=0px; bgcolor= "CC6633" width="1350" height="200"> <tr> <td><img src="logo.png" width="150" height"150"></td> <td><font color="yellow" face="Tahoma"><u> <h1>MOHAMMAD ALI JAUHAR UNIVERSITY</h1></u> <font color="white" face="Tahoma"> <h2>Jauhar Nagar, Rampur, U.P., India</h2> </td></tr></th> </table> <table><table border=0px; bgcolor= "yellow" width="1350"> <tr> <td><font color="black" face="Tahoma"><b><CENTER><a href="home.html">HOME</a></td>
  • 40. Page | 40 <td><font color="black" face="Tahoma"><b><CENTER><a href="about.html">ABOUT</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="admissions.html">ADMISSIONS</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="contact.html">CONTACT US</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="results.html">RESULTS</a></td> </tr> </table> <font color="black" face="Tahoma"> <table border=0px; bgcolor= "FFCC99"width="1350"> <br><th id="name" colspan="4" bgcolor="white">LEAVE YOUR MESSAGE</th></center> <tr><td>Your Name</td> <td><input type="text" name="t1" size="20"></td></tr> <tr><td>E-mail</td> <td><input type="text" name="t2" size="20"></td></tr> <tr><td>Your Message</td> <td><textarea name="ta" row="80" cols="80"></textarea><br><br></td></tr> <th id="name" colspan="4" bgcolor="white">Call Us</th> <tr> <td><font size="5" color="black" face="Tahoma"> <ul> <li>Admission Cell: +91 75993 61707 / 08</li> <li>Registrar: +91 81712 73114 / +91 94577 35736</li> <li>Admin Officer: +91 98971 82240</li> </tr> <th id="name" colspan="4" bgcolor="white">REACH US</th> <tr> <td><font size="5" color="black" face="Tahoma"> Address: Mohammad Ali Jauhar University, Jauhar Nagar,Rampur - 244901, U.P., India </tr> </TABLE> <center> <font color="BLACK" face="Tahoma" size="3"><br><br><br><br> <H3>Page Design by MOHD.BILAL</H3>
  • 41. Page | 41 <h4>Contact: [email protected]</h4> </body> </html> 5: Results: <html> <head> <title>Admission form</title> <body> <center> <body bgcolor="FFCC99"> <table><table border=0px; bgcolor= "CC6633" width="1350" height="200"> <tr> <td><img src="logo.png" width="150" height"150"></td> <td><font color="yellow" face="Tahoma"><u> <h1>MOHAMMAD ALI JAUHAR UNIVERSITY</h1></u> <font color="white" face="Tahoma"> <h2>Jauhar Nagar, Rampur, U.P., India</h2> </td></tr></th> </table> <table><table border=0px; bgcolor= "yellow" width="1350"> <tr> <td><font color="black" face="Tahoma"><b><CENTER><a href="home.html">HOME</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="about.html">ABOUT</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="admissions.html">ADMISSIONS</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="contact.html">CONTACT US</a></td> <td><font color="black" face="Tahoma"><b><CENTER><a href="results.html">RESULTS</a></td> </tr> </table> <font SIZE="6" color="black" face="Tahoma"> <BR><BR> Even Semester Result Declared <br><br>
  • 42. Page | 42 <a href="http://jauharuniversity.edu.in/results.html">CLI CK HERE</a> to check the result </TABLE> <center> <font color="BLACK" face="Tahoma" size="3"><br><br><br><br> <H3>Page Design by MOHD.BILAL</H3> <h4>Contact: [email protected]</h4> </body> </html> RESULT: Program executes successfully.