Uploaded by shreevatsa g

Web programs

advertisement
1. A. Create a webpage that prints your name on the screen. (HTML)
<html>
<body>
My Name is Bharati Hundekar
</body>
</html>
Output:
1. B. Create a webpage and set its title to "This is a webpage".
(HTML)
<html>
<head>
<title>This is a webpage</title>
</head>
<body>
My Name is Bharati Huneker
</body>
</html>
Output:
2. Print the numbers 1 - 10, each number being a different
color. (HTML)
<html>
<body>
<font color="Violet">1</font>
<font color="blue">2</font>
<font color="gray">3</font>
<font color="pink">4</font>
<font color="orange">5</font>
<font color="brown">6</font>
<font color="yellow">7</font>
<font color="red">8</font>
<font color="purple">9</font>
<font color="navy blue">10</font>
</body>
</html>
Output:
3. Print a paragraph that is a description of a book, include the
title of the book as well as its author. Names and titles
should be underlined, adjectives should be italicized and
bolded. (HTML)
<html>
<body>
<p>
One particular book which is recommended reading is <u>The Street
Lawyer</u> by <u>John Grisham</u>.
This book is about a lawyer who begins re-evaluating his priorities in
life when a bad
incident occurs within his law firm. Consequently, he becomes
acquainted with the inner city streets,
and realizes the harsh existence of the homeless, and vows to give
them a chance in the courts.
<u>The Street Lawyer</u> is a <b><i>great</i></b>
book. It is <b><i>well written</i></b> and
<b><i>interesting</i></b>.
Other books by <u>John Grisham</u> include <u>The Firm</u>,
<u>The Pelican Brief</u>, and <u>The Client</u>.
</p>
</body>
</html>
Output:
4. Print the squares of the numbers 1 - 20. Each number should be on a
separate line, next to it the number 2 superscripted, an equal sign and
the result.(Example: 10^2= 100) (HTML)
<html>
<body>
1<sup>2</sup> = 1
<br />
2<sup>2</sup> = 4
<br />
3<sup>2</sup> = 9
<br />
4<sup>2</sup> = 16
<br />
5<sup>2</sup> = 25
<br />
6<sup>2</sup> = 36
<br />
7<sup>2</sup> = 49
<br />
8<sup>2</sup> = 64
<br />
9<sup>2</sup> = 81
<br />
10<sup>2</sup> = 100
</body>
</html>
Output:
5. Create links to five different pages on five different websites that
should all open in window. (HTML)
<html>
<head>
<title>Links to various pages</title>
</head>
<body>
<a href="https://www.indiabix.com">
Indiabix page
</a>
<br /><br />
<a href="https://www.google.co.in">
search Engine
</a>
<br /><br />
<a href="https://www.youtube.com">
youtube
</a>
<br /><br />
<a href="http://www.weather.com">
Find out local weather
</a>
<br /><br />
<a href="https://www.w3schools.com">
Learn about technical subject
</a>
</body>
</html>
Output:
6. A. Setting a background image for a page Using CSS
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-image: url("image1.jpg");
}
</style>
</head>
<h1>Good Morning all</h1>
</body>
</html>
Output:
6 B. Setting text color and background color Using CSS
<html>
<style>
body
{
background-color:blue;
color: green;
}
</style>
<body>
<p>This page has a blue background color and a white text.</p>
</body>
</html>
Output:
7. Setting the font type of text Setting the font size of text Setting the
font color of text Setting the font style of text Using CSS
<html>
<head>
<style>
p.italic
{
font-style: italic;
}
.p1 {
font-family: "Times New Roman",;
}
p{
font-size: 80px;
}
p{
color: green;
}
</style>
</head>
<body>
<p class="italic">This is another paragraph.</p>
<p class="p1">This is a paragraph, shown in the Times New Roman font.</p>
</body>
</html>
Output:
8. Create a webpage with two images which alternately
changes on mouse overusing CSS.
<html>
<head>
<title>Image Swap on Hover with CSS</title>
<style>
.card {
width: 130px;
height: 195px;
position: relative;
display: inline-block;
}
.card .img-top {
display: none;
position: absolute;
top: 10;
left: 0;
}
.card:hover .img-top {
display: inline;
}
</style>
</head>
<body>
<div class="card">
<img src="image1.jpg" alt="image">
<img src="image2.jfif" class="img-top" alt="Card Front">
</div>
</body>
</html>
Output:
9. Write a JavaScript program to display the current day and time in
the following
format. Go to the editor Sample Output : Today is : Tuesday.
Current time is : 10 PM : 30 : 38
<html>
<body>
<script type="text/javascript">
var myDate = new Date();
var myDay = myDate.getDay();
var weekday = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday',
'Saturday' ];
document.write("Today is : " + weekday[myDay]);
document.write("<br/>");
var hours = myDate.getHours();
var ampm = hours >= 12 ? 'PM' : 'AM';
hours = hours % 12;
hours = hours ? hours : 12;
var minutes = myDate.getMinutes();
minutes = minutes < 10 ? '0' + minutes : minutes;
var myTime = hours + " " + ampm + " : " + minutes + " : " + myDate.getMilliseconds();
document.write("\tCurrent time is : " + myTime);
</script>
</body>
</html>
Output:
10. Write a JavaScript program to convert temperatures to and from Celsius,
Fahrenheit.
<html>
<head>
<script>
function Fahrenheit() {
var f = 1.8 * document.getElementById("input").value + 32;
document.getElementById("result").innerHTML = f;
}
</script>
</head>
<body>
<p>Enter Celsius value :</p>
<input id="input" />
<button onclick="Fahrenheit()">Convert to Fahrenheit</button>
<p id="result"></p>
</body>
</html>
11. Write a JavaScript program to find the largest of three
given integers.
<html>
<head>
<title>max no </title>
</head>
<body>
<script type="text/javascript">
var result = Math.max(648, 148, 364);
document.write("Maximum of the given numbers: "+result);
</script>
</body>
</html>
12. Create a webpage with two textboxes and command buttons to
perform arithmetic operations and display the result in appropriate
dialog boxes using JavaScript.
<html>
<head>
<script>
var numOne, numTwo, res, temp;
function fun()
{
numOne = parseInt(document.getElementById("one").value);
numTwo = parseInt(document.getElementById("two").value);
if(numOne && numTwo)
{
temp = document.getElementById("res");
temp.style.display = "block";
res = numOne + numTwo;
document.getElementById("add").value = res;
res = numOne - numTwo;
document.getElementById("subtract").value = res;
res = numOne * numTwo;
document.getElementById("multiply").value = res;
res = numOne / numTwo;
document.getElementById("divide").value = res;
}
}
</script>
</head>
<body>
<p id="input">Enter First Number: <input id="one">
<br/><br/>
Enter Second Number: <input id="two"></p>
<p><button onclick="fun()">Add, Subtract, Multiply, Divide</button></p>
<p id="res" style="display:none;">
Addition Result = <input id="add"><br/><br/>
Subtraction Result = <input id="subtract"><br/><br/>
Multiplication Result = <input id="multiply"><br/><br/>
Division Result = <input id="divide"></p>
</body>
</html>
Output:
13 a.. Write a program to count 5 to 15 using php
<?php
$count = 5;
while($count <= 15)
{
echo $count;
echo "<br>" ;
$count++;
}
?>
Output:
13 b. Write a factorial program using for loop in PHP
<?php
$n = 5;
$f = 1;
for ($i=1; $i <= $n; $i++)
{
$f = $f * $i;
}
echo "Factorial of $n is $f";
?>
Output:
14 . write a program to create chess board in php using for loop
<table width="400px" cellspacing="0px" cellpadding="0px" border="1px">
<?php
for($row=1;$row<=8;$row++)
{
echo "<tr>";
for($column=1;$column<=8;$column++)
{
$total=$row+$column;
if($total%2==0)
{
echo "<td height=35px width=30px bgcolor=#FFFFFF></td>";
}
else
{
echo "<td height=35px width=30px bgcolor=#000000></td>";
}
}
echo "</tr>";
}
?>
</table>
Output:
15. Write a program to upload and disply an image using PHP.
<html>
<head>
<title>PHP File Upload example</title>
</head>
<body>
<form enctype="multipart/form-data" method="post">
Select image :
<input type="file" name="file"><br/>
<input type="submit" value="Upload" name="Submit1"> <br/>
</form>
<?php
if(isset($_POST['Submit1']))
{
$filepath = "images/" . $_FILES["file"]["name"];
if(move_uploaded_file($_FILES["file"]["tmp_name"], $filepath))
{
echo "<img src=".$filepath." height=200 width=300 />";
}
else
{
echo "Error !!";
}
}
?>
</body>
</html>
Output:
16 write a simple calculator program in PHP using Switch case
<html>
<body>
<form method="post">
First no:<input type="text" name="num1" /><br>
Second No:<input type="text" name="num2" /><br>
Enter option:<input type="text" name="option" /><br>
Result:<input type="submit" name="submit" value="Submit"/></br>
</form>
<?php
if(isset($_POST['submit']))
{
echo "1 -> Addition<br>";
echo "2 -> Subtraction<br>";
echo "3 -> multiplication<br>";
echo "4 -> Divison<br>";
$a = $_POST['num1'];
$b = $_POST['num2'];
$ch = $_POST['option'];
switch($ch)
{
case 1:
$r = $a+$b;
echo " Addition = ".$r ;
break;
case 2:
$r = $a-$b;
echo " Subtraction = ".$r ;
break;
case 3:
$r = $a*$b;
echo " Multiplication = ".$r ;
break;
case 4:
$r = $a/$b;
echo " Divison = ".$r ;
break;
default:
echo ("invalid option\n");
}
return 0;
}
?>
</body>
</html>
Output:
17. Write a PHP Program to find the length of the string and count the words in the
string.
<?php
$str1 = 'Bharati hundekar';
$len=strlen($str1);
echo "length of string is$len";
echo "<br>";
$word = str_word_count($str1);
echo "Total words of string $word";
?>
Output:
Download