Scribd
Upload
49 views

PHP Assignments

The document contains HTML code for three questions from an assignment. Question 1 contains HTML code for a page listing Indian states and their capitals in an ordered list, along with code for a table listing books and their prices. Question 2 contains HTML code using frames to divide a page into sections. Question 3 contains nested HTML code using framesets to divide pages into rows and columns.

Uploaded by

satishkokane.ydp
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
49 views

PHP Assignments

The document contains HTML code for three questions from an assignment. Question 1 contains HTML code for a page listing Indian states and their capitals in an ordered list, along with code for a table listing books and their prices. Question 2 contains HTML code using frames to divide a page into sections. Question 3 contains nested HTML code using framesets to divide pages into rows and columns.

Uploaded by

satishkokane.ydp
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 53

Assignment 1:

SET A:
Q1.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=>, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<p>List Of indian states with their capital</p>
<ol>
<li>Delhi</li>
<ul>
<li>New Delhi</li>
</ul>
<li>Haryana</li>
<ul>
<li>Chandigarh</li>
</ul>
<li>Gujarat</li>
<ul>
<li>Gandhinagar</li>
</ul>
<li>Rajasthan</li>
<ul>
<li>Jaipur</li>
</ul>
<li>Maharahtra</li>
<ul>
<li>Mumbai</li>
</ul>
<li>Uttarpradesh</li>
<ul>
<li>Lucknow</li>
</ul>
</ol>
</body>
</html>
Q2.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=>, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<p>List of books</p>
<table border="1px">
<tr>
<td rowspan="2">Item No</td>
<td rowspan="2">Item Name</td>
<td colspan="2">Price</td>
</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>345</td>
<td>00</td>
</tr>
</table>
</body>
</html>
Q3.
<!DOCTYPE html>
<html>
<head>
<title>Assignment</title>
</head>

<frameset rows="20%,60%,20%">
<frame src="header.html" />
<frame src="middle.html" />
<frame src="footer.html" />
</frameset>
</html>

<!DOCTYPE html>
<html>
<head>
<title>header</title>
</head>
<body>
<p><b>This is a header.</b></p>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<title>footer</title>
</head>
<body>
<p><b>This is a footer.</b></p>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<title>middle</title>
</head>

<frameset cols="30%,70%">
<frame src="left.html" />
<frame src="right.html" />
</frameset>
</html>
<!DOCTYPE html>
<html>
<head>
<title>left</title>
</head>
<body>
<p>Look in the box at the right for some information.</p>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<title>Right</title>
</head>
<body>
<p>Here is some information.</p>
</body>
</html>
SET B:
1)
<!DOCTYPE html>
<html>
<head>
<style>
.design {
font-size: 6pt;
color: red;
background-color: yellow;
line-height: 2;
}
</style>
<title>Assignment</title>
</head>
<body>
<div class="design">
<p>Operating System Information</p>
</div>
<form>
Enter Your Name:<input type="text" name="name" /><br />

Password:<input type="password" name="password" /><br />

Which of the following Operating System have you used?<br />


<input type="checkbox" value="Linux" />Linux
<input type="checkbox" value="Windows 10" />Windows 10
<input type="checkbox" value="macintosh 8.0" />Macintosh 8.0<br />

Which of the Operating system do you like the most?<br />


<input type="radio" id="linux" name="like" value="Linux" />Linux
<input
type="radio"
id="windows 10"
name="like"
value="Windows 10"
/>Windows 10
<input
type="radio"
id="macintosh 8.0"
name="like"
value="Macintosh 8.0"
/>Macintosh 8.0<br />

You have completed the form:<input type="button" value="Sign Up" />


</form>
</body>
</html>
2)
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="mystyle.css" />
</head>
<body>
<ul style="list-style-type: disc">
<li id="first">Non Flowering Plants</li>
<ul style="list-style-type: circle">
<li id="second">Fern</li>
<li id="third">Spore</li>
</ul>
<li id="fourth">Flowering Plants</li>
<ul style="list-style-type: disc">
<li id="fifth">Lilly</li>
<li id="sixth">
Rose
<ol>
<li id="seventh">Red Rose</li>
<li id="eight">Pink Rose</li>
</ol>
</li>
</ul>
</ul>
</body>
</html>
3)
<!DOCTYPE html>
<html>
<head>
<title>Pune City-IT hub Of India</title>
</head>
<body style="background-color: pink">
<h1 style="color: blue">PUNE</h1>
<ol>
<li style="color: yellow; font-style: italic; font: large">
Singhgad Fort
</li>
<li style="color: red; font-style: normal; font: smaller">
National Defence Academy
</li>
<li style="color: white; font-style: oblique; font: x-large">
Shaniwar Wada
</li>
<li style="color: black; font-style: initial; font: xx-large">
Dagadusheth Halwai Ganapati Temple
</li>
</ol>
<marquee behavior="scroll" direction="right"
>Pune is a sprawling city in the western Indian state of
Maharashtra.</marquee
>
<img
src="https://static.toiimg.com/thumb/msid-65395942,width-1200,height-
900,resizemode-4/.jpg"
height="400"
width="600"
alt="Pune City"
/>
</body>
</html>
SET C:
1)
<!DOCTYPE html>
<html>
<head>
<style>
.yellow {
position: absolute;
width: 300px;
height: 250px;
border: 50px solid yellow;
outline: 3px solid black;
}
.red {
/* position: absolute; */
width: 300px;
height: 250px;
background: rgb(90, 5, 5);
outline: 3px solid black;
/* border: 30px solid red; */
}
.row1 {
/* text allign */
text-align: center;
vertical-align: middle;
line-height: 40px;

/* to set position according to parent div */


position: absolute;
top: 65px;
left: 85px;

/* basic css */
width: 140px;
height: 40px;
background: white;
outline: 3px solid black;
}
.row2 {
/* text allign */
text-align: center;
vertical-align: middle;
line-height: 40px;

/* to set position according to parent div */


position: absolute;
top: 150px;
left: 65px;

/* basic css */
width: 180px;
height: 40px;
background: white;
outline: 3px solid black;
}
</style>
<title>Assignment</title>
</head>
<body>
<div class="yellow">
<div class="red">
<div class="row1">T.Y.Bsc(Comp Sci)</div>
<div class="row2">Academic Year 2021-2022</div>
</div>
</div>
</body>
</html>
2)
<!DOCTYPE html>
<html>
<head>
<title>Assignment</title>
<style>
ul {
list-style-type: none;
text-align: center;
margin: 0;
padding: 0;
overflow: hidden;
background-color: lightgray;
}
li {
float: left;
}
li a {
display: block;
color: blue;
text-align: center;
padding: 16px;
text-decoration: none;
}

li a:hover {
background-color: gray;
color: white;
}
</style>
</head>

<body>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#java">JAVA</a></li>
<li><a href="#html">HTML</a></li>
<li><a href="#css">CSS</a></li>
</ul>
</body>
</html>
Assignment 2:
SET A:
Html code:
<div class="container">
<div class="row margin-top">
<div class="col-sm-4 block1">
<h1>block 1</h1>
</div>
<div class="col-sm-8">
<div class="row">
<div class="col-sm-12 hidden-xs empty-block">
</div>
</div>
<div class="row">
<div class="col-sm-12 block2">
<h1>block 2</h1>
</div>
</div>
</div>
</div>
<div class="row margin-top">
<div class="col-sm-12 block-contain">
<div class="row">
<div class="col-sm-12 col-md-6">
<div class="row">
<div class="col-sm-12 block3">
<h1>block 3</h1>
</div>
</div>
<div class="row">
<div class="col-sm-6 block4">
<h1>block 4</h1>
</div>
<div class="col-sm-6 block5">
<h1>block 5</h1>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 block6">
<h1>block 6</h1>
</div>
<div class="col-sm-12 col-md-3">
<div class="row">
<div class="col-sm-12 block7">
<h1>block 7</h1>
</div>
</div>
<div class="row">
<div class="col-sm-12 block8">
<h1>block 8</h1>
</div>
</div>
<div class="row">
<div class="col-sm-12 block9">
<h1>block 9</h1>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Css code:
body {
text-align: center;
color: white;
background-color: #f0f0f0;
}
h1 {
margin-top: 40px;
}
.margin-top {
margin-top: 10px;
}
.block1 {
height: 300px;
background-color: #42a8c8;
border: 5px solid #f0f0f0;
}
.empty-block {
height: 150px;
}
.block2 {
height: 150px;
background-color: #5bbfb4;
border: 5px solid #f0f0f0;
}
.block-contain {
height: 620px;
}
.block3 {
height: 310px;
background-color: #5bbfb4;
border: 5px solid #f0f0f0;
}
.block4 {
height: 300px;
background-color: #42a8c8;
margin-top: 10px;
border: 5px solid #f0f0f0;
}
.block5 {
height: 300px;
background-color: #5bbfb4;
margin-top: 10px;
border: 5px solid #f0f0f0;
}
.block6 {
height: 620px;
background-color: #42a8c8;
border: 5px solid #f0f0f0;
}
.block7 {
height: 150px;
background-color: #5bbfb4;
border: 5px solid #f0f0f0;
}
.block8 {
height: 150px;
background-color: #42a8c8;
margin-top: 10px;
border: 5px solid #f0f0f0;
}
.block9 {
height: 300px;
background-color: #5bbfb4;
margin-top: 10px;
border: 5px solid #f0f0f0;
}
SET B:
Q1:
Html code:
<div id="viewport">
<!-- Sidebar -->
<div id="sidebar">
<header>
<a href="#">My App</a>
</header>
<ul class="nav">
<li>
<a href="#">
<i class="zmdi zmdi-view-dashboard"></i> Dashboard
</a>
</li>
<li>
<a href="#">
<i class="zmdi zmdi-link"></i> Shortcuts
</a>
</li>
<li>
<a href="#">
<i class="zmdi zmdi-widgets"></i> Overview
</a>
</li>
<li>
<a href="#">
<i class="zmdi zmdi-calendar"></i> Events
</a>
</li>
<li>
<a href="#">
<i class="zmdi zmdi-info-outline"></i> About
</a>
</li>
<li>
<a href="#">
<i class="zmdi zmdi-settings"></i> Services
</a>
</li>
<li>
<a href="#">
<i class="zmdi zmdi-comment-more"></i> Contact
</a>
</li>
</ul>
</div>
<!-- Content -->
<div id="content">
<nav class="navbar navbar-default">
<div class="container-fluid">
<ul class="nav navbar-nav navbar-right">
<li>
<a href="#"><i class="zmdi zmdi-notifications text-danger"></i>
</a>
</li>
<li><a href="#">Test User</a></li>
</ul>
</div>
</nav>
<div class="container-fluid">
<h1>Simple Sidebar</h1>
<p>
Make sure to keep all page content within the
<code>#content</code>.
</p>
</div>
</div>
</div>
Css code:
@import url('https://fonts.googleapis.com/css?
family=Roboto:300,400,400i,500');

body {
overflow-x: hidden;
font-family: 'Roboto', sans-serif;
font-size: 16px;
}

/* Toggle Styles */

#viewport {
padding-left: 250px;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
}

#content {
width: 100%;
position: relative;
margin-right: 0;
}

/* Sidebar Styles */

#sidebar {
z-index: 1000;
position: fixed;
left: 250px;
width: 250px;
height: 100%;
margin-left: -250px;
overflow-y: auto;
background: #37474F;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
}
#sidebar header {
background-color: #263238;
font-size: 20px;
line-height: 52px;
text-align: center;
}

#sidebar header a {
color: #fff;
display: block;
text-decoration: none;
}

#sidebar header a:hover {


color: #fff;
}

#sidebar .nav{

#sidebar .nav a{
background: none;
border-bottom: 1px solid #455A64;
color: #CFD8DC;
font-size: 14px;
padding: 16px 24px;
}

#sidebar .nav a:hover{


background: none;
color: #ECEFF1;
}

#sidebar .nav a i{
margin-right: 16px;
}
Q2.
Html code:
<link
href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
rel="stylesheet" id="bootstrap-css">
<script
src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></
script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->

<div class="small-top">
<div class="container">
<div class="row">
<div class="col-lg-4 date-sec">
<div id="Date"></div>
</div>
<div class="col-lg-3 offset-lg-5">
<div class="social-icon"> <a target="_blank" href="#" class=" fa fa-
facebook"></a> <a target="_blank" href="#" class=" fa fa-twitter"></a> <a
target="_blank" href="#" class=" fa fa-google-plus"></a> <a target="_blank"
href="#" class=" fa fa-linkedin"></a> <a target="_blank" href="#" class=" fa fa-
youtube"></a> <a target="_blank" href="#" class=" fa fa-vimeo-square"></a>
</div>
</div>
</div>
</div>
</div>
<div class="top-head left">
<div class="container">
<div class="row">
<div class="col-md-6 col-lg-4">
<h1>Grafreez News<small>Get the latest News</small></h1>
</div>
<div class="col-md-6 col-lg-3 ml-auto admin-bar hidden-sm-down">
<nav class="nav nav-inline"> <a href="#" class="nav-link"><span
class="ping"></span><i class="fa fa-envelope-o"></i></a> <a href="#"
class="nav-link"><i class="fa fa-bell-o"></i></a> <a href="#" class="nav-
link">Bruce Wayne <img class="img-fluid rounded-circle"
src="http://grafreez.com/wp-content/temp_demos/river/img/admin-
bg.jpg"></a> </nav>
</div>
</div>
</div>
</div>
</header>
<section class="top-nav">
<nav class="navbar navbar-expand-lg py-0">
<div class="container">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-
target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="exCollapsingNavbar2">
<ul class="nav navbar-nav ">
<li class="nav-item active"> <a class="nav-link" href="#">Home <span
class="sr-only">(current)</span></a> </li>
<li class="nav-item"> <a class="nav-link" href="#">World</a> </li>
<li class="nav-item"> <a class="nav-link" href="#">Politics</a> </li>
<li class="nav-item"> <a class="nav-link" href="#">Business</a> </li>
<li class="nav-item"> <a class="nav-link" href="#">Science</a> </li>
<li class="nav-item"> <a class="nav-link" href="#">Sports</a> </li>
<li class="nav-item"> <a class="nav-link" href="#">Tech</a> </li>
<li class="nav-item"> <a class="nav-link" href="#">Travel</a> </li>
<li class="nav-item"> <a class="nav-link" href="#">Health</a> </li>
</ul>
<form class="ml-auto">
<div class="search">
<input type="text" class="form-control" maxlength="64"
placeholder="Search" />
<button type="submit" class="btn btn-search"><i class="fa fa-
search"></i></button>
</div>
</form>
</div>
</div>
</nav>
</section>
<section class="banner-sec">
<div class="container">
<div class="row">
<div class="col-md-3">
<div class="card"> <img class="img-fluid" src="http://grafreez.com/wp-
content/temp_demos/river/img/politics.jpg" alt="">
<div class="card-img-overlay"> <span class="badge badge-pill badge-
danger">News</span> </div>
<div class="card-body">
<div class="news-title">
<h2 class=" title-small"><a href="#">Syria war: Why the battle for
Aleppo matters</a></h2>
</div>
<p class="card-text"><small class="text-time"><em>3 mins
ago</em></small></p>
</div>
</div>
<div class="card"> <img class="img-fluid" src="http://grafreez.com/wp-
content/temp_demos/river/img/travel.jpg" alt="">
<div class="card-img-overlay"> <span class="badge badge-pill badge-
danger">Politics</span> </div>
<div class="card-body">
<div class="news-title">
<h2 class=" title-small"><a href="#">Key Republicans sign letter
warning against</a></h2>
</div>
<p class="card-text"><small class="text-time"><em>3 mins
ago</em></small></p>
</div>
</div>
</div>
<div class="col-md-3">
<div class="card"> <img class="img-fluid" src="http://grafreez.com/wp-
content/temp_demos/river/img/business1.jpg" alt="">
<div class="card-img-overlay"> <span class="badge badge-pill badge-
danger">Travel</span> </div>
<div class="card-body">
<div class="news-title">
<h2 class=" title-small"><a href="#">Obamacare Appears to Be
Making People Healthier</a></h2>
</div>
<p class="card-text"><small class="text-time"><em>3 mins
ago</em></small></p>
</div>
</div>
<div class="card"> <img class="img-fluid" src="http://grafreez.com/wp-
content/temp_demos/river/img/food.jpg" alt="">
<div class="card-img-overlay"> <span class="badge badge-pill badge-
danger">News</span> </div>
<div class="card-body">
<div class="news-title">
<h2 class=" title-small"><a href="#">‘S.N.L.’ to Lose Two Longtime
Cast Members</a></h2>
</div>
<p class="card-text"><small class="text-time"><em>3 mins
ago</em></small></p>
</div>
</div>
</div>
<div class="col-md-6 top-slider">
<div id="carousel-example-generic" class="carousel slide" data-
ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0"
class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
</ol>

<!-- Wrapper for slides -->


<div class="carousel-inner" role="listbox">
<div class="carousel-item active">
<div class="news-block">
<div class="news-media"><img class="img-fluid"
src="http://grafreez.com/wp-content/temp_demos/river/img/politics1.jpg"
alt=""></div>
<div class="news-title">
<h2 class=" title-large"><a href="#">Ray madison may struggle to
get best from Paul in a 4-2-3-1 formation</a></h2>
</div>
<div class="news-des">Condimentum ultrices mi est a arcu at cum a
elementum per cum turpis dui vulputate vestibulum in vehicula montes vel.
Mauris nam suspendisse consectetur mus...</div>
<div class="time-text"><strong>2h ago</strong></div>
<div></div>
</div>
</div>
<div class="carousel-item">
<div class="news-block">
<div class="news-media"><img class="img-fluid"
src="http://grafreez.com/wp-content/temp_demos/river/img/sport1.jpg"
alt=""></div>
<div class="news-title">
<h2 class=" title-large"><a href="#">An Alternative Form of
Mental Health Care Gains a Foothold</a></h2>
</div>
<div class="news-des">Condimentum ultrices mi est a arcu at cum a
elementum per cum turpis dui vulputate vestibulum in vehicula montes vel.
Mauris nam suspendisse consectetur mus...</div>
<div class="time-text"><strong>2h ago</strong></div>
<div></div>
</div>
</div>
<div class="carousel-item">
<div class="news-block">
<div class="news-media"><img class="img-fluid"
src="http://grafreez.com/wp-content/temp_demos/river/img/health.jpg"
alt=""></div>
<div class="news-title">
<h2 class=" title-large"><a href="#">Key Republican Senator Says
She Will Not Vote for former president!</a></h2>
</div>
<div class="news-des">Condimentum ultrices mi est a arcu at cum a
elementum per cum turpis dui vulputate vestibulum in vehicula montes vel.
Mauris nam suspendisse consectetur mus...</div>
<div class="time-text"><strong>2h ago</strong></div>
<div></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section-01">
<div class="container">
<div class="row">
<div class="col-lg-8 col-md-12">
<h3 class="heading-large">Politics</h3>
<div class="">
<div class="col-lg-6 card">
<div class="card"> <img class="img-fluid" src="http://grafreez.com/wp-
content/temp_demos/river/img/war.jpg" alt="">
<div class="card-body">
<div class="news-title"><a href="#">
<h2 class=" title-small">Minorities Suffer From Unequal Pain
Treatment</h2>
</a></div>
<p class="card-text">Some quick example text to build on the card
title and make up the bulk of the card's content.</p>
<p class="card-text"><small class="text-time"><em>3 mins
ago</em></small></p>
</div>
</div>
</div>
<div class="col-lg-6 card">
<div class="card"> <img class="img-fluid" src="http://grafreez.com/wp-
content/temp_demos/river/img/politics.jpg" alt="">
<div class="card-body">
<div class="news-title"><a href="#">
<h2 class=" title-small">Minorities Suffer From Unequal Pain
Treatment</h2>
</a></div>
<p class="card-text">Some quick example text to build on the card
title and make up the bulk of the card's content.</p>
<p class="card-text"><small class="text-time"><em>3 mins
ago</em></small></p>
</div>
</div>
</div>
<div class="col-lg-6 card">
<div class="card"> <img class="img-fluid" src="http://grafreez.com/wp-
content/temp_demos/river/img/movie.jpg" alt="">
<div class="card-body">
<div class="news-title"><a href="#">
<h2 class=" title-small">Minorities Suffer From Unequal Pain
Treatment</h2>
</a></div>
<p class="card-text">Some quick example text to build on the card
title and make up the bulk of the card's content.</p>
<p class="card-text"><small class="text-time"><em>3 mins
ago</em></small></p>
</div>
</div>
</div>
<div class="col-lg-6 card">
<div class="card"> <img class="img-fluid" src="http://grafreez.com/wp-
content/temp_demos/river/img/travel1.jpg" alt="">
<div class="card-body">
<div class="news-title"><a href="#">
<h2 class=" title-small">Minorities Suffer From Unequal Pain
Treatment</h2>
</a></div>
<p class="card-text">Some quick example text to build on the card
title and make up the bulk of the card's content.</p>
<p class="card-text"><small class="text-time"><em>3 mins
ago</em></small></p>
</div>
</div>
</div>
</div>
</div>
<aside class="col-lg-4 side-bar col-md-12">
<ul class="nav nav-tabs" role="tablist" id="myTab">
<li class="nav-item"> <a class="nav-link active" data-toggle="tab"
href="#home" role="tab">Latest</a> </li>
<li class="nav-item"> <a class="nav-link" data-toggle="tab"
href="#profile" role="tab">Top</a> </li>
<li class="nav-item"> <a class="nav-link" data-toggle="tab"
href="#messages" role="tab">Featured</a> </li>
</ul>

<!-- Tab panes -->


<div class="tab-content sidebar-tabing" id="nav-tabContent">
<div class="tab-pane active" id="home" role="tabpanel">
<div class="media"> <a href="#"> <img class="d-flex mr-3"
src="http://grafreez.com/wp-content/temp_demos/river/img/sport2.jpg"
alt="Generic placeholder image"></a>
<div class="media-body">
<div class="news-title">
<h2 class="title-small"><a href="#">Key Republicans sign letter
warning against candidate</a></h2>
</div>
<div class="news-auther"><span class="time">1h
ago</span></div>
</div>
</div>
<div class="media"> <a href="#"> <img class="d-flex mr-3"
src="http://grafreez.com/wp-content/temp_demos/river/img/lifestyle.jpg"
alt="Generic placeholder image"></a>
<div class="media-body">
<div class="news-title">
<h2 class="title-small"><a href="#">Obamacare Appears to Be
Making People Healthier</a></h2>
</div>
<div class="news-auther"><span class="time">1h ago</span></div>
</div>
</div>
<div class="media"> <a href="#"> <img class="d-flex mr-3"
src="http://grafreez.com/wp-content/temp_demos/river/img/food1.jpg"
alt="Generic placeholder image"></a>
<div class="media-body">
<div class="news-title">
<h2 class="title-small"><a href="#">Key Republicans sign letter
warning against candidate</a></h2>
</div>
<div class="news-auther"><span class="time">1h ago</span></div>
</div>
</div>
</div>
<div class="tab-pane" id="profile" role="tabpanel">
<div class="media"> <a href="#"> <img class="d-flex mr-3"
src="http://grafreez.com/wp-content/temp_demos/river/img/movie.jpg"
alt="Generic placeholder image"></a>
<div class="media-body">
<div class="news-title">
<h2 class="title-small"><a href="#">Key Republicans sign letter
warning against candidate</a></h2>
</div>
<div class="news-auther"><span class="time">1h ago</span></div>
</div>
</div>
<div class="media"> <a href="#"> <img class="d-flex mr-3"
src="http://grafreez.com/wp-content/temp_demos/river/img/auto.jpg"
alt="Generic placeholder image"></a>
<div class="media-body">
<div class="news-title">
<h2 class="title-small"><a href="#">‘S.N.L.’ to Lose Two Longtime
Cast Members</a></h2>
</div>
<div class="news-auther"><span class="time">1h ago</span></div>
</div>
</div>
<div class="media"> <a href="#"> <img class="d-flex mr-3"
src="http://grafreez.com/wp-content/temp_demos/river/img/business1.jpg"
alt="Generic placeholder image"></a>
<div class="media-body">
<div class="news-title">
<h2 class="title-small"><a href="#">Obamacare Appears to Be
Making People Healthier</a></h2>
</div>
<div class="news-auther"><span class="time">1h ago</span></div>
</div>
</div>
</div>
<div class="tab-pane" id="messages" role="tabpanel">
<div class="media"> <a href="#"> <img class="d-flex mr-3"
src="http://grafreez.com/wp-content/temp_demos/river/img/food.jpg"
alt="Generic placeholder image"></a>
<div class="media-body">
<div class="news-title">
<h2 class="title-small"><a href="#">Key Republicans sign letter
warning against candidate</a></h2>
</div>
<div class="news-auther"><span class="time">1h ago</span></div>
</div>
</div>
<div class="media"> <a href="#"> <img class="d-flex mr-3"
src="http://grafreez.com/wp-content/temp_demos/river/img/business.jpg"
alt="Generic placeholder image"></a>
<div class="media-body">
<div class="news-title">
<h2 class="title-small"><a href="#">‘S.N.L.’ to Lose Two Longtime
Cast Members</a></h2>
</div>
<div class="news-auther"><span class="time">1h ago</span></div>
</div>
</div>
<div class="media"> <a href="#"> <img class="d-flex mr-3"
src="http://grafreez.com/wp-content/temp_demos/river/img/sport1.jpg"
alt="Generic placeholder image"></a>
<div class="media-body">
<div class="news-title">
<h2 class="title-small"><a href="#">Key Republicans sign letter
warning against candidate</a></h2>
</div>
<div class="news-auther"><span class="time">1h ago</span></div>
</div>
</div>
</div>
</div>
<div class="video-sec">
<h4 class="heading-small">Featured Video</h4>
<div class="video-block">
<div class="embed-responsive embed-responsive-4by3">
<iframe class="embed-responsive-item"
src="//www.youtube.com/embed/zpOULjyy-n8?rel=0"
allowfullscreen></iframe>
</div>
</div>
</div>
</aside>
</div>
</div>
</section>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVN
A/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.
js"
integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISf
wAzpKaMNFNmj4" crossorigin="anonymous"></script>
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min
.js" integrity="sha384-
h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1"
crossorigin="anonymous"></script>
Css code:
@import url("//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-
awesome.css");

body {
color: #5a5a5a;
font-family: 'Open Sans',Arial,sans-serif;
font-size: 15px;
}
h1,h2,h3,h4,h5{
font-family: 'Montserrat', sans-serif;
}
a, a:hover, .btn{outline:none!important;}
.btn-search{background: #FD3A13; border-color: #FD3A13; color: #fff; padding:
7px 10px}
.btn-search:hover{background: #ca1b1b; border-color: #ca1b1b}
section{padding: 30px 0; float: left; width: 100%}
.card{float: left; width:100%}
.navbar {border: medium none; float: left; margin-bottom: 0px; width: 100%;
border-radius: 0}
.title-large {font-size: 20px; margin: 10px 0 5px; line-height: 27px; color:
#141517;}
.title-small { color: #141517; font-size: 16px; font-weight: 400; line-height:
23px; margin: 6px 0 0;}
.title-x-small {font-size: 18px; margin: 0px;}
.title-large a, .title-small a, .title-x-small a{color: inherit}
.banner-sec{float: left; width: 100%; background: #EBEBEB}
.card-block{padding:0 10px 10px;}
.card-text{margin: 0}
.text-time{color: #ff0000; font-weight: 600;}
.banner-sec .card-img-overlay{padding: 0; top: 3px; left: 7px; height: 20%}

header{float: left; width:100%}


.small-top{ border-bottom: 1px solid #2b2b2b;float: left; width: 100%;
background: #000}
.small-top .social-icon{float: right;}
.small-top .social-icon a {border-left: 1px solid #2b2b2b; color: #ca1b1b; float:
left; padding: 6px 13px;}
.small-top .social-icon a:last-child {border-right: 1px solid #2b2b2b;}
.small-top .social-icon a:hover {color:#FD3A13; text-decoration: none;}
.small-top .date-sec {font-size: 13px; font-weight: 600; float: left; margin-top:
4px; color: #898989}
.top-head{background: #141517; width: 100%; float: left; height: 100px;}
.top-head h1 {color: #fff; font-size: 36px; font-weight: 600; margin: 18px 0 0;}
.top-head small{float: left; width: 100%; font-size: 14px; color: #c0c0c0;
margin-top: 5px; margin-left: 5px;}
.top-head .admin-bar {text-align: right; margin-top: 22px;}
.top-head .admin-bar a {color: #fff; line-height: 49px; position: relative;
padding:0 7px;}
.top-head .admin-bar a:hover{color: #ff0000}
.top-head .admin-bar a i{margin-right: 6px;}
.top-head .admin-bar .ping {background: #ff0000; border: 3px solid #141517;
border-radius: 50%; height: 14px; position: absolute; right: 3px; top: 13px;
width: 14px; z-index: 1;}
.top-head .admin-bar img {float: right; height: 50px; width: 50px; margin-left:
18px;}
.top-nav{background: #fff; padding: 0; border-bottom: 1px solid #dbdbdb}
.top-nav .nav-link {padding-bottom: 0.7rem; padding-top: 0.7rem;}
.top-nav .navbar-nav .nav-item + .nav-item{margin-left:0}
.top-nav li a{color: #141517; text-transform: uppercase; font-size: 14px; font-
weight: 700; padding: 0 10px; border-bottom: 2px solid #fff}
.top-nav li a:hover, .top-nav li a:focus, .top-nav li.active a{color: #141517;
border-bottom: 2px solid #FD3A13 }
.top-nav .form-control{border-color: #fff}
.navbar-toggle{background: #fff;}
.navbar-toggle .icon-bar{background:#0A2E61; }
.navbar-brand{display: none;}

.top-slider .carousel-indicators{bottom: 0}
.top-slider .carousel-indicators li{border:1px solid #000;}
.top-slider .carousel-indicators .active{background:#000;}
.side-bar .nav-tabs{border-bottom:none;}
.side-bar .nav-tabs .nav-link {color: #aeaeae; text-transform: uppercase;
border: none;}
.side-bar .nav-tabs .nav-link.active, .side-bar .nav-tabs .nav-link:hover{border-
bottom:2px solid #ff0000; text-transform: uppercase; color: #222}
.sidebar-tabing .media{margin-top: 20px}
.sidebar-tabing img{width: 120px;height: 100px;}
.sidebar-tabing .title-small {line-height: 23px; margin-top: 5px; font-size: 18px}

#search {float: right; margin-top: 9px; width: 250px;}


.search {padding: 5px 0; width: 230px; height: 30px; position: relative; left:
10px; float: left; line-height: 22px;}
.search input {background: #d0d0d0; border: medium none; border-radius: 3px
0 0 3px; float: left; height: 36px; line-height: 18px; margin-left: 210px; padding:
0 9px; position: absolute; top: -3px; width: 0; -webkit-transition: all 0.7s ease-
in-out; -moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out; transition: all 0.7s ease-in-out;}
.search:hover input, .search input:focus { width: 200px; margin-left: 0px;
background: #d0d0d0;}
.top-nav .btn {position: absolute;right: 0;top: -3px;border-radius:3px;}

.banner-sec{float: left; width:100%;}


.banner-sec .news-block{margin-bottom: 20px}
.banner-sec .news-block:last-child{margin-bottom: 0px}
.banner-sec .news-des {margin-bottom: 5px;}
.banner-sec .title-large{margin: 18px 0 0}
.banner-sec .time{margin-top: 0px; font-size: 13px;}
.banner-sec .carousel-control.left, .banner-sec .carousel-
control.right{background: none;}
.banner-sec .card{margin-bottom:20px;}

.section-01{float: left; width: 100%; border-top: 1px solid #d5d5d5; border-


bottom: 1px solid #d5d5d5}
.section-01 .heading-large {border-bottom: 2px solid #222; color: #222; float:
left; width: 100%; padding:0 0 6px; margin:0 0 18px; text-align: left;}
.section-01 .heading-large::before, .section-01 .heading-
large::after{background: transparent;}
.section-01 .heading-small {border-bottom: 2px solid #222; color: #222; float:
left; margin: 7px 0 0; width: 100%; padding-bottom: 10px; font-size: 18px }
.section-01 .title-small {margin-bottom: 5px; font-size:17px }
.section-01 .news-block{border-bottom: 1px dashed #000; padding-bottom:
30px; border: none;}
.section-01 aside > .news-block{border-bottom: 1px dashed #000; padding-
bottom: 19px;}
.section-01 aside > .news-block:last-child{border-bottom: none; margin-
bottom: 20px}
.section-01 .card{border: none;}
.section-01 .card-block{padding: 10px 0;}
.section-01 .video-sec {float: left; margin-top: 30px; width: 100%;}
.section-01 .video-block {float: left; margin-top: 20px; width: 100%;}

.action-sec{width:100%; float:left; background:#222}


.action-box{float:left; width:100%; text-align:center;}
.action-box h2{color:#fff; font-size:20px;}

Assignment 4:
SET A:
1)
<?php
$temp = array(1,2,3,4,5,6,4,5,2,2,22,1,2,12,32,12,32,54,2,3,12,2);
sort($temp);
$cold = array_slice($temp,0,5);
$hot = array_slice($temp,-6,-1);
echo "Top 5 cold temperatures = ";
foreach($cold as $c)
{
echo $c.",";
}
echo "<br>Top 5 hot temperatures = ";
// print_r(explode(",",$hot));
foreach($hot as $h)
{
echo $h.",";
}
echo "<br>";
$sum = 0;
foreach ($temp as $t)
{
$sum = $sum+$t;
}

$avg = $sum/count($temp);
echo "Avegare temperature = ".$avg;
?>
2)
<form method="POST">
<input type="radio" id="insert_s" name="choice" value="1">
<label for="insert_s">Insert an element in stack</label><br>
<input type="radio" id="delete_s" name="choice" value="2">
<label for="delete_s">Delete an element from stack</label><br>
<input type="radio" id="display_s" name="choice" value="3">
<label for="display_s">Display the contents of stack</label><br><br>
Value: <input type="text" name="value"><br><br>
<input type="submit" name="submit" value="submit">
</form>

<?php
if(isset($_POST['submit']))
{
$arr = array();
$choice = $_POST['choice'];
$val = $_POST['value'];
switch($choice)
{
case 1:
array_push($arr,$val);
break;
case 2:
array_pop($arr);
break;

case 3:
print_r($arr);

}
}

?>

SET B:
1)
<form method="POST">
Enter the position: <input type="text" name="pos"><br><br>
Enter the value: <input type="text" name="val"><br><br>
<input type="submit" name="submit">
</form>

<?php

if(isset($_POST['submit']))
{
$val = $_POST['val'];
$pos = $_POST['pos'];

$arr = array(1,2,3,4,5);
$arr1 = array_slice($arr,0,$pos-1);
$arr2 = array_slice($arr,$pos-1);
array_push($arr1,$val);
$arr3 = array_merge($arr1,$arr2);

foreach($arr3 as $a)
{
echo $a."<br>";
}
}

?>
2)
<form method="POST">
Enter the element to be searched: <input type="text"
name="value"><br><br>
<input type="submit" name="submit">
</form>

<?php

if(isset($_POST['submit']))
{
$val = $_POST['value'];
$arr = array(1,2,3,4,5,2,3,5,6,3);
$pos = array_search($val, $arr);
if(!empty($pos))
{
echo "Element found at position: ".$pos+1;
}
else
{
echo "Element not found in the array";
}
}
?>
Assignment 5:
SET A:
1)
<?php

$myfile = fopen("sample.txt", "r") or die("Unable to open file!");


echo fread($myfile,filesize("sample.txt"))."\n";
echo "<br>File size = ".(filesize("sample.txt"))."\n";
fclose($myfile);

?>
2)
<form method="POST">
<input type="text" name="title" style="font-size: 18px;"><br><br>
<input type="submit" name="sub" style="font-size: 18px;">
</form>
<?php
if(isset($_POST['sub']))
{
$t = $_POST['title'];
//echo "title = $t<br>";
$db = pg_connect("host=localhost dbname=ty user=postgres ");
//echo "xyz";
if($db)
{
//echo "connected";
$qry = "SELECT ec.cno from committee as c, ev_co as ec,
event as e where c.cno=ec.cno and e.eno=ec.eno and e.title='$t'";
$ret = pg_query($db,$qry);
$row = pg_fetch_row($ret);
$r = $row[0];
//echo "row = $r";
echo "<br>";

$u_qry = "UPDATE committee set status='working' where


cno=$r ";
$u_ret = pg_query($db,$u_qry);
if($u_ret)
{
echo "Updated";
}
else
{
echo "not Updated";
}
}
else
{
echo "not connected";
}
}
?>
SET B:
1)
<?php
$array = file ('data.dat');
if ($array)
{
?>
<table border="2" style="border-collapse: collapse;" cellpadding="7">
<tr>
<th>Item Code</th>
<th>Item Name</th>
<th>Unit Sold</th>
<th>Rate</th>
</tr>
<?php

foreach ($array as $value)


{
$data = explode(' ', $value);

echo "<tr>";
echo "<td>".$data[0]."</td>";
echo "<td>".$data[1]."</td>";
echo "<td>".$data[2]."</td>";
echo "<td>".$data[3]."</td>";
echo "</tr>";
}
echo "</table>";
}
?>
2)
<form method="POST">
<input type="text" name="c_name"><br><br>
<input type="submit" name="sub">
</form>

<?php
if(isset($_POST['sub']))
{
$c = $_POST['c_name'];
$db = pg_connect("host=localhost dbname=ty user=postgres ");
if($db)
{
$qry = "SELECT sc.rank,s.name,s.calss,sc.year FROM student
as s, competition as c, stud_comp as sc where s.sid=sc.sid and c.cno=sc.cno
and sc.rank=1 and c.cname='$c'";

$ret = pg_query($db,$qry);

while($row = pg_fetch_row($ret))
{
echo "rank = $row[0]<br>";
echo "name = $row[1]<br>";
echo "class = $row[2]<br>";
echo "year = $row[3]<br>";
echo "<br>";
}
}
}

?>

You might also like