Web Program

1a.Design a web page using different text formatting tags.
CODE:
<html>
<body>
<p>it is normal text </p>
<p><b> it is bold text </b></p>
<p><strong> it is strong text </strong></p>
<p><i> it is italic text </i></p>
<p><em> it is emphasized text </em></p>
<h2>HTML <small> samller text </small>formatting</h2>
<h2>HTML <mark> marked text </mark> formatting</h2>
<p>my favorite color <del>bule</del> red </p>
<p>my favorite color <ins>red</ins></p>
<p>it is <sub> subscripted </sub> text </p>
<p> it is <sup> superscripted </sup> text </p>
</body>
</html>
OUTPUT:
1b. Design a web page with links to different pages and allow navigation between
web pages.
CODE:
<html>
<head>
<title> web page navigation</title>
<h1 align="center"><font color="red"><strong>web programming
</strong></font></h1>
</head>
<body style="background-color: white;">
<div style="font-size:160%;">
<a href="1b.html">home </a> &nbsp&nbsp
<a href="tag.html">tag</a>
</div>
<div align="center"style="font-size:160%;">
<br><br>
html<br>
css<br>
JavaScript<br>
php<br>
</div>
</body>
</html>
OUTPUT:
2a.Design a web page with Imagemaps
CODE:
<!DOCTYPE html>
<html>
<head>
<title>Image Mapping</title>
</head>
<body>
<center>
<h1 style="font-size: 35px">World Map</h1>
<img src="Wp.jpg" width="969" height="500" alt="Countries"
usemap="#World Map">
<map name="World Map">
<area shape="rect" coords="135,96,325,144" alt="NA"
href="https://en.wikipedia.org/wiki/North_America">
<area shape="rect" coords="236,258,410,288" alt="SA"
href="https://en.wikipedia.org/wiki/South_America">
<area shape="rect" coords="667,176,729,197" alt="India"
href="https://en.wikipedia.org/wiki/India">
<area shape="rect" coords="547,78,635,105" alt="EU"
href="https://en.wikipedia.org/wiki/Europe">
<area shape="circle" coords="734,107,25" alt="ASI"
href="https://en.wikipedia.org/wiki/Asia">
<area shape="circle" coords="543,207,25" alt="AF"
href="https://en.wikipedia.org/wiki/Africa">
<area shape="circle" coords="842,307,25" alt="AS"
href="https://en.wikipedia.org/wiki/Australia">
</map>
</center>
</body>
</html>
OUTPUT:
2b.Design a web page with different tables. Design a webpages using table
so that
the content appears well placed.
CODE:
<html>
<head>
<style>
table,th,td{
border:1px solid black;
align:center;
}
</style>
<title>HTML table demo </title>
<h1 align="center"><font color="red"><strong>HTML table</strong></font></h1>
</head>
<body style="background-color: white;">
<table align="center"style="width:60%">
<h2 align="center">my reading list</h2>
<tr>
<th>Name</th>
<th>Book Title</th>
<th>Read</th>
</tr>
<tbody>
<td>Ganesh </td>
<td>Game Of Thorns</td>
<td>Yes</td>
</tr>
</tbody>
</table>
</br></br>
<h2 align="center">friends reading list</h2>
<table style="width:60%"align="center">
<tr>
<th align="center">Student Name</th>
<th> Book Name </th>
<th>Duration</th>
</tr>
<tr>
<td>salil</td>
<td>PUBG</td>
<td> 3 hr</td>
</tr>
<tr>
<td>aakash</td>
<td>instagram</td>
<td> not fix </td>
</tr>
<tr>
<td>Rishabh</td>
<td>fireman</td>
<td>........</td>
</tr>
</table>
</body>
</html>
OUTPUT:
2c.Design a web page with a form that uses all types of controls
CODE:
<html>
<body>
<form>
<table border=1 align="center">
<marquee><h1>Registration Form </h1></marquee>
<tr>
<td>Enter Name</td><td><input type=text name="uname"></td>
</tr>
<tr>
<td>Enter Password </td><td><input type=password name="upass"></td>
</tr>
<tr>
<td>Enter Password </td><td><input type=password name="upass"></td>
</td>
<tr>
<td>Select Gender:</td>
<td>
male<input type=radio name="Gender"value="male">
female<input type=radio name="Gender"value="female">

</td>
</tr>
<tr>
<td>select hobbies</td>
<td>Cricket<input type=checkbox name="Cricket"value="Cricket">
football<input type=checkbox name="Cricket"value="football"></td>
</tr>
<tr>
<td>select country</td>
<td>
<select name="country">
<option>India</option>
<option>USA</option>
<option>Canada</option>
<option>South Africa</option>
</select>
</td>
</tr>
<tr>
<td>Enter Address</td>
<td><textarea name="address" row=5 col=10 ></textarea></td>
</tr>
<tr>
<td><input type=submit></td>
</tr>
</table>
</form>
OUTPUT:
3a. Using JavaScript design, a web page that prints factorial series
CODE:
Factorial:
<!DOCTYPE html>
<html>
<head>
<title>Factorial Demo</title>
<script language="javascript">
var x=parseInt(prompt("Enter a number",""));
var fact=1,i;
for(i=1;i<=x;i++)
fact*=i;
document.write("<h1>Factorial of "+x+" is : "+fact+"</h1>");
</script>
</head>
<body>
</body>
</html>
Fibonacci:
<!DOCTYPE html>
<html>
<head>
<title>Fibonacci series Demo</title>
var a=0,b=1,c,n,i;
n=parseInt(prompt("Enter limit for fibonacci series:",""));
document.write("<h2> Fibonacci series: </h2><br>");
document.write(a+" "+b+" ");
for(i=2;i<n;i++)
{
c=a+b;
document.write(c+" ");
a=b;
b=c;
}
</script>
</head>
<body>
</body>
</html>
OUTPUT:
OUTPUT:
3b. Design a form and validate all the controls placed on the form using
Java Script.
CODE:
<html>
<head>
<title>Form Validation</title>
<script type="text/javascript">
function validate()
{
if( document.myForm.Name.value == "" )
{
alert( "Please provide your name!" );
document.myForm.Name.focus();
return false;
}
if( document.myForm.EMail.value == "" )
{
alert( "Please provide your Email!" );
document.myForm.EMail.focus();
return false;
}
if( document.myForm.Zip.value == "" ||
isNaN( document.myForm.Zip.value ) ||
document.myForm.Zip.value.length != 5 )
{
alert( "Please provide a zip in the format #####." );
document.myForm.Zip.focus();
return false;
}
if( document.myForm.Country.value == "-1" )
{
alert( "Please provide your country!" );
return false;
}
return(true);
}
</script>
</head>
<body>
<form name="myForm" onsubmit="return(validate());">
<table cellspacing="2" cellpadding="2" border="1">
<tr>
<td align="right">Name</td>
<td><input type="text" name="Name" /></td>
</tr>
<tr>
<td align="right">EMail</td>
<td><input type="text" name="EMail" /></td>
</tr>
<tr>
<td align="right">Zip Code</td>
<td><input type="text" name="Zip" /></td>
</tr>
<tr>
<td align="right">Country</td>
<td> <select name="Country"> <option value="-1" selected>[choose
yours]</option>
<option value="1">USA</option>
<option value="2">UK</option>
<option value="3">INDIA</option>
</select>
</td>
</tr>
<tr>
<td align="right"></td>
<td><input type="submit" value="Submit" /></td>
</tr>
</table>
</form>
</body>
</html>
OUTPUT:
3c. Write a JavaScript program to display all the prime numbers between
7 and 63.
CODE:
<!DOCTYPE html>
<html>
<head>
<title>prime number</title>
<script>
for(var i=7;i<=63;i++)
{
var flag=0;
for(var j=2;j<=i/2;j++)
{
if(i%j==0)
{
flag=1;
break;
}
}
if(flag==0)
{
document.write(i+"<br>");
}
}
</script>
</head>
</html>
OUTPUT:
3d. Write a java script program to design a page to display table of a
number
between 11 to 20
CODE:
<html>
<head>
<title>Multiplication Table</title>
<script type="text/javascript">
var j=1;
var output = "<table border='1' width='500' cellspacing='0'cellpadding='5'>";
for(i=1;i<=10;i++)
output = output + "<tr>";
for(j=11;j<=20;j++)
output = output + "<td>" + i*j + "</td>";
j = j++;
output = output + "</tr>";

j = 1;
output = output + "</table>";
document.write(output);
</script>
</head>
<body>
</body>
</html>
OUTPUT:
4a. Write a java script program to design a page to display to find a greatest
number
out of given three numbers.

CODE:
<html>
<head>
<title>
JavaScript
</title>
function greater()
{
var num1=parseInt(document.f1.t1.value);
if(num1>num2 && num1>num3)
{
alert(num1 +" is greatest number");
}
else if(num2>num1 && num2>num3)
{
}
else
{
}
}
</script>
</head>
<body>
<h1 align="center"><font color="red">Javascript for find greatest and
smallest</font></h1>
<form name=f1>
num1: <input type="textbox" name=t1><br>
num2: <input type="textbox" name=t2><br>
num3: <input type="textbox" name=t3><br><br><br>
<input type="button" value="greatest" onclick="greater()" >
</form>
</body>
</html>
OUTPUT:
4b. Write a java script program to design simple calculator.
CODE:
<html>
<head>
<script>
//function that display value
function dis(val)
{
document.getElementById("result").value+=val
}
//function that evaluates the digit and return result

function solve()
{
let x = document.getElementById("result").value
let y = eval(x)
document.getElementById("result").value = y
}
//function that clear the display

function clr()
{
document.getElementById("result").value = ""
}
</script>

<style>
.title{
margin-bottom: 10px;
text-align:center;
width: 210px;
color:green;
border: solid black 2px;
}
input[type="button"]
{
background-color:white;
color: black;
width:100%
}
input[type="text"]
{
background-color:white;
width:100%
}
</style>
</head>

<body>
<div class = title >calculator</div>
<table border="1">
<tr>
<td colspan="3"><input type="text" id="result"/></td>

<td><input type="button" value="c" onclick="clr()"/> </td>
</tr>
<tr>


<td><input type="button" value="1" onclick="dis('1')"/> </td>
<td><input type="button" value="/" onclick="dis('/')"/> </td>
</tr>
<tr>
<td><input type="button" value="-" onclick="dis('-')"/> </td>
</tr>
<tr>
<td><input type="button" value="+" onclick="dis('+')"/> </td>
</tr>
<tr>
<td><input type="button" value="." onclick="dis('.')"/> </td>

<td><input type="button" value="=" onclick="solve()"/> </td>
<td><input type="button" value="*" onclick="dis('*')"/> </td>
</tr>
</table>
</body>
</html>
OUTPUT:

Web Program

Загружено:

Сведения о документе

Оригинальное название

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Web Program

Загружено:

Авторское право:

Доступные форматы

1a.Design a web page using different text formatting tags.

female<input type=radio name="Gender"value="female">

var output = "<table border='1' width='500' cellspacing='0'cellpadding='5'>";

output = output + "<tr>";

output = output + "<td>" + i*j + "</td>";

output = output + "</tr>";

output = output + "</table>";

out of given three numbers.

//function that evaluates the digit and return result

//function that clear the display

Вам также может понравиться