[go: up one dir, main page]

0% found this document useful (0 votes)
256 views27 pages

CMA Record BCA 4th Sem

Uploaded by

Saba S
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
256 views27 pages

CMA Record BCA 4th Sem

Uploaded by

Saba S
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 27

S.G.T COLLEGE, BELLARY.

1. Write a HTML program to illustrate basic text markup tags

<html>
<head>
<title> basic tags html</title>
</head>
<p><i><u><b> SGT COLLEGE BALLARI</p></i></u></b>
<h1>Bachelor's in Computer Application</1h>
<h2>Bachelor's in Computer Application</h2>
<h3>Bachelor's in Computer Application</h3>
<h4>Bachelor's in Computer Application</h4>
<h5>Bachelor's in Computer Application</h5>
<h6>Bachelor's in Computer Application</h6>
</body>
</html>

Output
SGT COLLEGE BALLARI

Bachelor's in Computer Application


Bachelor's in Computer Application
Bachelor's in Computer Application
Bachelor's in Computer Application
Bachelor's in Computer Application
Bachelor's in Computer Application

Department of Computer Science, BCA 4th Semester Page 1


S.G.T COLLEGE, BELLARY.
2. Write the HTML program to illustrate Table tags
<html>
<head>
<title>COLLEGE TIME TABLE</title>
</head>
<body bgcolor="black">
<H1><FONT COLOR="DARKCYAN"><CENTER>
COLLEGE TIME TABLE</FONT></H1>
<table border="3" cellspacing="5" align="center">
<tr>
<td align="center">
<td><font color="blue">8:00-9:00
<td><font color="PINK">9:00-10:00
<td><font color="GREEN">10:00-11:00
<td><font color="YELLOW">11:0-12:00
</tr>
<tr>
<td align="center"><font color="white">MONDAY</td>
<td align="center">---<font color="blue">ENGLISH<br>
<td align="center">---<font color="yellow">MATHS<br>
<td align="center">---<font color="pink">PYTHON<br>
<td align="center">---<font color="BROWN">HTML<br>
</tr>
<tr>
<td align="center">---<font color="purple">TUESDAY</td>
<td align="center">---<font color="blue">KANNDA<br>
<td align="center">---<font color="red">JAVA<br>
<td align="center">---<font color="pink">HTML<br>
<td align="center">---<font color="orange">ENGLISH<br>
</tr>
<tr>
<td align="center">---<font color="green">WEDNESDAY</td>
<td align="center">---<font color="pink">PYTHON<br>
<td align="center">---<font color="orange">DBMS<br>
Department of Computer Science, BCA 4th Semester Page 2
S.G.T COLLEGE, BELLARY.
<td align="center">---<font color="brown">OE<br>
<td align="center">---<font color="pink">PYTHON<br>
</tr>
<tr>
<td align="center">---<font color="blue">THURSDAY</td>
<td align="center">---<font color="green">ENGLISH<br>
<td align="center">---<font color="brown">XHTML<br>
<td align="center">---<font color="orange">PHP<br>
<td align="center">---<font color="pink">MATHS<br>
</tr>
<tr>
<td align="center">---<font color="yellow">FRIDAY</td>
<td align="center">---<font color="orange">CNN<br>
<td align="center">---<font color="maroon">OST<br>
<td align="center">---<font color="blue">IC<br>
<td align="center">---<font color="pink">HTML<br>
</tr>
<tr>
<td align="center">---<font color="lightpink">SATURDAY</td>
<td align="center">---<font color="red">C++<br>
<td align="center">---<font color="white">c#<br>
<td align="center">---<font color="pink">HTML<br>
<td align="center">---<font color="yellow">JAVA<br>
</tr>
</body>
</html>

Department of Computer Science, BCA 4th Semester Page 3


S.G.T COLLEGE, BELLARY.
Output
COLLEGE TIME TABLE
8:00-9:00 9:00-10:00 10:00-11:00 11:0-12:00
MONDAY ---ENGLISH ---MATHS ---PYTHON ---HTML
---TUESDAY ---KANNDA ---JAVA ---HTML ---ENGLISH
---WEDNESDAY ---PYTHON ---DBMS ---OE ---PYTHON
---THURSDAY ---ENGLISH ---XHTML ---PHP ---MATHS
---FRIDAY ---CNN ---OST ---IC ---HTML
---SATURDAY ---C++ ---c# ---HTML ---JAVA

Department of Computer Science, BCA 4th Semester Page 4


S.G.T COLLEGE, BELLARY.
3. Write HTML5 program to create an application form for student
admission
<html>
<head>
<script type="text/javascript" src="validate.js"></script>
</head>
<body>
<form action="#" name="StudentRegistration"
onsubmit="return(validate());">
<table cellpadding="2" width="20%" bgcolor="99FFFF" align="center"
cellspacing="2">
<tr>
<td colspan=2>
<center><font size=4><b>Student Registration
Form</b></font></center>
</td>
</tr>
<tr>
<td>Name</td>
<td><input type=text name=textnames id="textname" size="30"></td>
</tr>
<tr>
<td>Father Name</td>
<td><input type="text" name="fathername" id="fathername"
size="30"></td>
</tr>
<tr>
<td>Mother Name</td>

Department of Computer Science, BCA 4th Semester Page 5


S.G.T COLLEGE, BELLARY.
<td><input type="text" name="paddress" id="paddress"
size="30"></td>
</tr>
<tr>
<td>Address</td>
<td><input type="text" name="personaladdress"
id="personaladdress" size="30"></td>
</tr>
<tr>
<td>Sex</td>
<td><input type="radio" name="sex" value="male" size="10">Male
<input type="radio" name="sex" value="Female"
size="10">Female</td>
</tr>
<tr>
<td>City</td>
<td><select name="City">
<option value="-1" selected>select..</option>
<option value="New Delhi">NEW DELHI</option>
<option value="Mumbai">MUMBAI</option>
<option value="Goa">GOA</option>
<option value="Patna">PATNA</option>
</select></td>
</tr>
<tr>
<td>Course</td>
<td><select name="Course">
<option value="-1" selected>select..</option>
<option value="B.Tech">B.TECH</option>
<option value="MCA">MCA</option>
Department of Computer Science, BCA 4th Semester Page 6
S.G.T COLLEGE, BELLARY.
<option value="MBA">MBA</option>
<option value="BCA">BCA</option>
</select></td>
</tr>
<tr>
<td>District</td>
<td><select name="District">
<option value="-1" selected>select..</option>
<option value="Nalanda">NALANDA</option>
<option value="UP">UP</option>
<option value="Goa">GOA</option>
<option value="Patna">PATNA</option>
</select></td>
</tr>
<tr>
<td>State</td>
<td><select Name="State">
<option value="-1" selected>select..</option>
<option value="New Delhi">NEW DELHI</option>
<option value="Mumbai">MUMBAI</option>
<option value="Goa">GOA</option>
<option value="Bihar">BIHAR</option>
</select></td>
</tr>
<tr>
<td>PinCode</td>
<td><input type="text" name="pincode" id="pincode" size="30"></td>
</tr>
<tr>
<td>EmailId</td>
Department of Computer Science, BCA 4th Semester Page 7
S.G.T COLLEGE, BELLARY.
<td><input type="text" name="emailid" id="emailid" size="30"></td>
</tr>
<tr>
<td>DOB</td>
<td><input type="text" name="dob" id="dob" size="30"></td>
</tr>
<tr>
<td>MobileNo</td>
<td><input type="text" name="mobileno" id="mobileno"
size="30"></td>
</tr>
<tr>
<td><input type="reset"></td>
<td colspan="2"><input type="submit" value="Submit Form" /></td>
</tr>
</table>
</form>
</body>
</html>

Department of Computer Science, BCA 4th Semester Page 8


S.G.T COLLEGE, BELLARY.
Output

Department of Computer Science, BCA 4th Semester Page 9


S.G.T COLLEGE, BELLARY.
4. Write HTML5 program to illustrate simple <Video> And <Audio>
tags.

<html>
<head>
<title> welcome to html</title>
</head>
<body>
<video control autoplay muted loop width="250" height="250"
<video src="C:\Users\HP\Desktop\Planet Earth_ Amazing.mp4" controls>
</video>
<br>
<br>
<audio controls>
<source src="E:\songs\Dosti.mp3.Mp3">
</audio>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 10


S.G.T COLLEGE, BELLARY.
5. A)Write a html program to draw circle and rectangle

<html>
<head>
<title>svg circle and rectangle</title>
</head>
<body>
<svg height="100" width="100">
<circle cx="50" cy="50" r="40" stroke="black" stroke-width="3"
fill="red"/>
</svg><br><br>
<svg width="400" height="110">
<rect width="300" height="100" style="fill:rgb(0,0,255);stroke-width:3;
stroke:rgb(0,0,0)"/>
</svg>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 11


S.G.T COLLEGE, BELLARY.
5 B) Write a html program to draw svg ellipse and star

<html>
<head>
<title>svg eclipse and star</title>
</head>
<body>
<svg height="140" width="500">
<ellipse cx="200" cy="80" rx="100" ry="50"
style="fill:yellow;stroke:gold;stroke-width:2"/>
</svg><br><br>
<svg height="210" width="500">
<polygon points="100,10 40, 198 190, 78 10, 78 160, 198"
style="fill:lime;stroke:violet;strokewidth:5;fill-rule:nonzero;"/>
</svg>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 12


S.G.T COLLEGE, BELLARY.
5. C) Write a html program to draw a svg line

<html>
<head>
<title>svg line</title>
</head>
<body>
<svg height="210" width="500">
<line x1="0" y1="0" x2="200" y2="200"
style="stroke:rgb(255,0,0);stroke-width:2"/>
</svg>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 13


S.G.T COLLEGE, BELLARY.
6. Write a HTML5 program to draw canvas rectangles, lines, circle using
JavaScript.
<html>
<head>
<title>canvas Drawing</title>
<style>
canvas {
border: 1px solid #333333;
}
</style>
</head>
<body>
<h1>canvas drawing</h1>
<canvas id="myCanvas" width="400" height="400">
</canvas>
<script>
//get the canvas elements
var canvas = document.getElementById ('myCanvas')
var ctx = canvas.getContext('2d');
// Draw a line
ctx.strokeStyle='423442';
ctx.lineWidth=6;
ctx.beginPath();
ctx.moveTo(200,50)
ctx.lineTo(300,150);
ctx.stroke();
//Draw a rectangle
ctx.fillStyle='#ffcc00';
ctx.fillRect(50,50,100,50);
//Draw a circle
ctx.fillStyle='#ff0000';

Department of Computer Science, BCA 4th Semester Page 14


S.G.T COLLEGE, BELLARY.
ctx.beginPath();
ctx.arc(250,250,50,0,2*Math.PI);
ctx.fill();
</script>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 15


S.G.T COLLEGE, BELLARY.
7. Write HTML5 program to draw Bezier curve and Quadratic curves.
<html>
<head>
<title>Canvas Curves</title>
<style>
canvas {
border:1px solid #333333
}
</style>
</head>
<body>
<h1>Canvas Curves</h1>
<canvas id="myCanvas" width="400" height="400"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d')
// Drawing Bezier curve
ctx.strokeStyle = 'green';
ctx.beginPath();
ctx.moveTo(50,100);
ctx.bezierCurveTo(150,50,250,150,350,100)
ctx.stroke();
// Drawing quadratic curve
ctx.strokeStyle= 'red'
ctx.beginPath();
ctx.moveTo(50,250);
ctx.quadraticCurveTo(200,200,350,250);
ctx.stroke();
</script>
</body>
</html>

Department of Computer Science, BCA 4th Semester Page 16


S.G.T COLLEGE, BELLARY.
Output

Department of Computer Science, BCA 4th Semester Page 17


S.G.T COLLEGE, BELLARY.
8.A Write a HTML5 program to illustrate canvas-Text & Font

<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="578" height="200"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');

context.font = 'italic 40pt Calibri';


context.fillText('Hello World!', 150, 100);
</script>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 18


S.G.T COLLEGE, BELLARY.
8. B) Write a HTML5 program to illustrate canvas pattern

<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="578" height="200"></canvas>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
var imageObj = new Image();
imageObj.onload = function()
{
var pattern = context.createPattern(imageObj, 'repeat');
context.rect(0, 0, canvas.width, canvas.height);
context.fillStyle = pattern;
context.fill();
};
imageObj.src =
'http://www.html5canvastutorials.com/demos/assets/wood-
pattern.png';
</script>
</body>
</html>
Department of Computer Science, BCA 4th Semester Page 19
S.G.T COLLEGE, BELLARY.
Output

Department of Computer Science, BCA 4th Semester Page 20


S.G.T COLLEGE, BELLARY.
9 Write HTML5 Program to demonstrate canvas Translation of an
object

<html>
<body>
<h1>HTML5 Canvas</h1>
<h2>The translate() Method</h2>
<canvas id="myCanvas" width="300" height="150" style="border:1px
solid grey"></canvas>
<script>
const c = document.getElementById("myCanvas");
const ctx = c.getContext("2d");
ctx.fillRect(10, 10, 100, 50);
ctx.translate(70, 70);
ctx.fillRect(10, 10, 100, 50);
</script>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 21


S.G.T COLLEGE, BELLARY.
10. a Write HTML5 Program to demonstrate canvasRotation

<html>
<body>
<h1>HTML5 Canvas</h1>
<h2>The rotate() Method</h2>

<canvas id="myCanvas" width="300" height="150" style="border:1px


solid grey"></canvas>

<script>
const c = document.getElementById("myCanvas");
const ctx = c.getContext("2d");
ctx.rotate(20 * Math.PI / 180);
ctx.fillRect(50, 20, 100, 50);
</script>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 22


S.G.T COLLEGE, BELLARY.
10.b Write HTML5 Program to demonstrate canvas Scaling of an objest

<html>
<body>
<h1>HTML5 Canvas</h1>
<h2>The scale() Method</h2>
<canvas id="myCanvas" width="300" height="150" style="border:1px
solid grey"></canvas>
<script>
const c = document.getElementById("myCanvas");
const ctx = c.getContext("2d");
ctx.strokeRect(5, 5, 25, 15);
ctx.scale(2, 2);
ctx.strokeRect(5, 5, 25, 15);
</script>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 23


S.G.T COLLEGE, BELLARY.
11. a Write a HTML program canvas drawing rectangles by using 3
methods

<html>
<head>
<style>
#test{
width: 100px;
height:100px;
margin: 0px auto; }
</style>
<script type = "text/javascript">
function drawShape() {
var canvas = document.getElementById('mycanvas');
if (canvas.getContext) {
var ctx = canvas.getContext('2d');
ctx.fillRect(25,25,100,100);
ctx.clearRect(45,45,60,60);
ctx.strokeRect(50,50,50,50);
}
}
</script>
</head>
<body id = "test" onload = "drawShape();">
<canvas id = "mycanvas">
</canvas>
</body>
</html>
Output

Department of Computer Science, BCA 4th Semester Page 24


S.G.T COLLEGE, BELLARY.
11. b Write a HTML program color or style to use for the lines around
shapes strokeStyle

<html>
<head>
<title>web page</title>
<style type="text/css">
#test {
width:100px;
height:100px;
margin:0px auto;
}
</style>
<script type="text/javascript">
function drawShape()
{
var canvas =document.getElementById('mycanvas');
if(canvas.getContext)
{
var ctx=canvas.getContext('2d');
for(var i=0;i<10;i++)
{
for(var j=0;j<10;j++)
{
ctx.strokeStyle ='rgb(255,'+Math.floor(50-2.5*i)+','+
Math.floor(155-22.5*j )+')';
ctx.beginPath();
ctx.arc(1.5+j*25,1.5+i*25,10,10,Math.PI*5.5,true);
ctx.stroke();
}

Department of Computer Science, BCA 4th Semester Page 25


S.G.T COLLEGE, BELLARY.
}
}
else
{
alert('You need Safari or Firefox 1.5+ to see this demo.');
}
}
</script>
</head>
<body id="test" onload="drawShape();">
<canvas id= "mycanvas"></canvas>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 26


S.G.T COLLEGE, BELLARY.
12. Write HTML5 program to illustrate canvas – Gradients.

<html>
<head>
<title>Example for Canvas-Gradients</title>
</head>
<body>
<canvas id = "myCanvas" width="400" height="400"></canvas>
<script>
const c = document.getElementById("myCanvas");
const ctx = c.getContext("2d");
// Create gradient
const grd = ctx.createLinearGradient(0, 0, 200, 0);
grd.addColorStop(0, "red");
grd.addColorStop(1, "white");
// Fill with gradient
ctx.fillStyle = grd;
ctx.fillRect(10, 10, 150, 80);
</script>
</body>
</html>

Output

Department of Computer Science, BCA 4th Semester Page 27

You might also like