TYBCS Web Tecnologies-I Slip Solutions
Slip 2
Create HTML5 page with following specifications
i) Title should be about your City.
ii) Color the background by Pink color.
iii) Place your city name at the top of page in large text and in blue color.
iv) Add names of the landmarks in your city, each in different color, style and font
v) Add any image at the bottom. (Use inline CSS to format the web page)
<HTML>
<head><TITLE><CENTER>My City</CENTER></TITLE>
</head>
<body style="background-color:pink;">
<h1 style="text-align: center ; Color: blue;"> My City name: Pune </h1>
<h1 style="font-size=30; color: powderblue; "> ::Pune city Landmarks:: </h1>
<ul >
<li style="color : blue; font-size=20; font-family:verdana;">National Defence Academy</li>
<li style="color : red; font-size=21; font-family:arial;">Dagadusheth Halwai Ganapati
Temple</li>
<li style="color : green ;font-size=19; font-family:courier;">ISKCON NVCC
28
Temple</li>
<li style="color : yellow; font-size=22; font-family:Calibri;">Pune University</li>
</ul>
<div style="background-color: lightblue;width: 210px; height: 210px; overflow: scroll;">
Pune, also called ‘Poona’, is situated in the state of Maharashtra, India.
It is also known as the ‘Queen of the Deccan’ and attained its high importance when it
became the capital
of Bhonsle Marathas in the 17th century.
</div>
<img style="border: 1px solid red; border-radius: 4px; padding: 5px; width: 150px;"
src="puneimage.jpg"></img>
</body>
</HTML>
Slip 3
Write a program using html with following CSS specifications-
i. The background colour of the company name should be in green.
ii. The text colour of the company name should be red.
iii. The heading should be large –with font ''comic sans ms''
iv. The description of the company should be displayed in blue color in a paragraph.
<!DOCTYPE html>
<html>
<head>
<title>Tata Motors</title>
<style>
h1{
text-align: center;
background-color: green;
color: red;
font-family: “Comic Sans MS”;
}
p{
color: blue;
}
</style>
</head>
<body>
<h1>Tata Motors</h1>
<p>
Tata Motors Limited is an Indian multinational automotive manufacturing company,
headquartered in the city of Mumbai, India which is part of Tata Group. The company
produces passenger cars, trucks, vans, coaches, buses, luxury cars, sports cars, construction
equipment.
</p>
</body>
</html>
Slip 4
Write a HTML code, which generate the following output
<!DOCTYPE html>
<html>
<body>
<table border="1">
<tr><th colspan="4"> LIST OF BOOKS </th></tr>
<tr><th rowspan="2"> ITEM No</th><th rowspan="2"> ITEM NAME</th><th
colspan="2">PRICE</th></tr>
<tr><th>RS</th><th>paise</th></tr>
<tr><th>1</th><td>PROGRAMMING IN PYTHON</td><td>500</td><td>50</td></tr>
<tr><th>2</th><td>PROGRAMMING IN JAVA</td><td>385</td><td>00</td></tr>
</body>
</html>
Slip 5
Create following Bootstrap Web Layout Design and change Title, add your personal
information, educational information, job profile.
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class="jumbotron text-center">
<h1>My First Bootstrap Page</h1>
37
<p>Resize this responsive page to see the effect!</p>
</div>
<div class="container">
<div class="row">
<div class="col-sm-4">
<h3>Personal Information</h3>
<p>Add your personal information..</p>
<p>...</p>
</div>
<div class="col-sm-4">
<h3>Educational Information</h3>
<p>Add your educational information....</p>
<p>...</p>
</div>
<div class="col-sm-4">
<h3>Job Profile</h3>
<p>Add your job profile information.....</p>
<p>...</p>
</div>
</div>
</div>
</body>
</html>
Slip 8
Design an HTML form to accept two strings from the user. Write a PHP script for the
following.
a. Find whether the small string appears at the start of the large string.
b. Find the position of the small string in the big string.
c. Compare both the string for first n characters, also the comparison should not be case
sensitive.
<!DOCTYPE html>
<html>
<body>
<form name=f method=get action=http://localhost/as3setb1.php>
<center>
<table>
<tr><th colspan=2><h1>Choose Menu</h1></th></tr>
<tr><td>Enter the string 1:</td> <td><input type=text name =s1></td></tr><br>
<tr><td>Enter the string 2:</td> <td><input type=text name =s2></td></tr><br>
<tr><td><input type=radio name=op value=1></td> <td>a.Find whether the small string
appears at the start of the large string.
.</td></tr><br>
<tr><td><input type=radio name=op value=2></td> <td>b.Find the position of the small
string in the big string. </td></tr><br>
<tr><td><input type=radio name=op value=3></td> <td>c. Compare both the string for first
n characters, also the comparison
should not be case sensitive. </td></tr><br>
<tr><th colspan=2><input type=submit name=sb value=Submit></th></tr>
</table>
</center>
</body>
</html>
/*as3setb1.php*/
<?php
include("func.php");
$x=$_GET['s1'];
$y=$_GET['s2'];
$ch=$_GET['op'];
switch($ch)
{
case 1:appear($x,$y); break;
case 2:echo strpos($y,$x); break;
case 3:compare($x,$y); break;
}
?>
Slip 9
Write a PHP script for the following: Design a form having a text box and a drop down list
containing any 3 separators(e.g. #, |, %, @, ! or comma) accept a strings from the user and
also a separator.
a. Split the string into separate words using the given separator.
b. Replace all the occurrences of separator in the given string with some other separator.
c. Find the last word in the given string.
<!DOCTYPE html>
<html>
<body>
<form name=f method=get action=http://localhost/as3setb2.php>
<center>
<table>
<tr><th colspan=2><h1>Choose Menu</h1></th></tr>
<tr><td>Enter a string:</td> <td><input type=text name =t></td></tr><br>
<tr><td>Enter a separator:</td>
<td><select name=sep>
<option value=#>#</option>
<option value=|>|</option>
<option value=%>%</option>
</select></td></tr><br>
<tr><td><input type=radio name=op value=1></td> <td>a.Split the string.</td></tr><br>
<tr><td><input type=radio name=op value=2></td> <td>b.Replace separator.</td></tr><br>
<tr><td><input type=radio name=op value=3></td> <td>c.Find the last word.</td></tr><br>
<tr><th colspan=2><input type=submit name=sb value=Submit></th></tr>
</table>
</center>
</body>
</html>
<?php
include("func.php");
$x=$_GET['t'];
$ch=$_GET['op'];
$s=$_GET['sep'];
switch($ch)
{
case 1:splits($x,$s); break;
case 2:replace($x,$s); break;
case 3:last($x); break;
}
?>
Slip 10
Write a script to accept two integers(Use html form having 2 textboxes).
Write a PHP script to,
a. Find mod of the two numbers.
b. Find the power of first number raised to the second.
c. Find the sum of first n numbers (considering first number as n)
d. Find the factorial of second number.
(Write separate function for each of the above operations.)
as3seta1.html
<!DOCTYPE html>
<html>
<body>
<form name=f method=get action=as3seta1.php>
<centre>
<table>
<tr><th colspan=2><h1>Choose menu</h1></th></tr>
<tr><td enter 1st number:</td><td><input type=text name=t1></td></tr></br>
<tr><td enter 2nd number:</td><td><input type=text name=t2></td></tr></br>
<tr><td><input type=radio name=op value=1></td><td> a.find the mod of 2
numbers.</td></tr></br>
<tr><td><input type=radio name=op value=2></td><td> b.find the power of first raised to
second.</td></tr></br>
<tr><td><input type=radio name=op value=3></td><td> c.find the sum of first n
numbers .</td></tr></br>
<tr><td><input type=radio name=op value=4></td><td> a.find the factorial of second
numbers.</td></tr></br>
<tr><th colspan =2><input type=submit name=s value=Submit></th><tr>
</table>
</centre>
</form>
</body>
</html>
Fun2.php
<?php
function mod($n,$m)
{
$md=$n%$m;
echo "Mod of".$n."and".$m."is".$md;
}
function power($n,$m)
{
$p=1;
for($i=0;$i<$m;$i++)
{
$p=$p*$n;
}
echo $p;
}
function sum($n)
{
$s=0;
for($i=1;$i<=$n;$i++)
{
$s=$s+$i;
}
echo $s;
}
function fact($m)
{
$f=1;
while($m>0)
{
$f=$f*$m;
$m--;
}
echo $f;
}
?>
as3seta1.php
<?php
include("fun2.php");
$n=$_GET['t1'];
$m=$_GET['t2'];
$ch=$_GET['op'];
switch($ch)
{
case 1:
mod($n,$m);
break;
case 2:
power($n,$m);
break;
case 3:
sum($n);
break;
case 4:
fact($m);
break;
}
?>
Slip 12
Write a PHP script for the following: Design a form to accept two numbers from the user.
Give options to choose the arithmetic operation (use radio buttons). Display the result on the
next form. (Use the concept of function and default parameters. Use ‘include’ construct or
require statement)
<html>
<body>
<form method="post" action="a1setb1.php">
Enter first number :
<input type="text" name="no1" value=" "><br>
Enter Second number :
<input type="text" name="no2" value=" "><br>
<input type='radio' name='op' value='1'>Addition<br>
<input type='radio' name='op' value='2'>Multiplication<br>
<input type='radio' name='op' value='3'>Subtraction<br>
<input type='radio' name='op' value='4'>Division<br>
<input type='submit' name='submit' value='submit'>
</form>
</body>
</html>
calculator.php
<?php
function add($a,$b)
{
$s=$a+$b;
return $s;
}
function sub($a,$b)
{
$s=$a-$b;
return $s;
}
function mul($a,$b)
{
$s=$a*$b;
return $s;
}
function div($a,$b)
{
if($b==0)
echo "Division not possible.<br>";
else
$s=$a/$b;
return $s;
}
?>
a1setb1.php
<?php
include 'calculator.php';
$a=$_POST['no1'];
$b=$_POST['no2'];
$c=$_POST['op'];
switch($c)
{
case 1:
$d=add($a,$b);
echo "Addition :$d";break;
case 2:
$d=mul($a,$b);
echo "Multiplication :$d";break;
case 3:
$d=sub($a,$b);
echo "Subtraction:$d";break;
case 4:
$d=mul($a,$b);
echo "Division:$d";break;
}
?>
Slip 13
Write a PHP script to create a chess board using CSS on table cells.
<!DOCTYPE html>
<html>
<body>
<table width="400px" border="1px" cellspacing="0px">
<?php
echo "Chess by GeeksforGeeks";
$value = 0;
for($col = 0; $col < 8; $col++) {
echo "<tr>";
$value = $col;
for($row = 0; $row < 8; $row++) {
if($value%2 == 0) {
echo
"<td height=40px width=20px bgcolor=black></td>";
$value++;
}
else {
echo
"<td height=40px width=20px bgcolor=white></td>";
$value++;
}
}
echo "</tr>";
}
?>
</table>
</body>
</html>
Slip15
Design a form to accept string from the user and perform the following operations
a. To select first 5 words from the string
b. Convert the given string to lowercase and then to Title case.
c. Pad the given string with “*” from left and right both the sides.
d. Remove the leading whitespaces from the given string.
e. Find the reverse of given string.
<?php
// Function to find the length of a string without using built-in functions
function findStringLength($string) {
$length = 0;
while (isset($string[$length])) {
$length++;
}
return $length;
}
// Function to count the total number of vowels in a string
function countVowels($string) {
$vowels = ['a', 'e', 'i', 'o', 'u'];
$count = 0;
$string = strtolower($string);
for ($i = 0; $i < strlen($string); $i++) {
if (in_array($string[$i], $vowels)) {
$count++;
}
}
return $count;
}
// Function to convert a string to lowercase and then to title case
function convertToTitleCase($string) {
$string = strtolower($string);
$string = ucwords($string);
return $string;
}
// Function to pad a string with "*" from left and right
function padString($string) {
$string = "*" . $string . "*";
return $string;
}
// Function to remove leading whitespaces from a string
function removeLeadingWhitespaces($string) {
$string = ltrim($string);
return $string;
}
// Example usage
$inputString = "Hello World";
echo "Length of the string: " . findStringLength($inputString) . "<br>";
echo "Total number of vowels: " . countVowels($inputString) . "<br>";
echo "String in title case: " . convertToTitleCase($inputString) . "<br>";
echo "Padded string: " . padString($inputString) . "<br>";
echo "String with leading whitespaces removed: " .
removeLeadingWhitespaces($inputString) . "<br>";
?>
