0% found this document useful (0 votes)
55 views

Assignment SESSION (2018-2022) : Submitted by

The document is an assignment submission by Muhammad Ahmad to Sir Mohsin Malik in the Web Design and Development department at Riphah International University Lahore. It includes pictures, code for a website template with navigation bar, carousel, about section and services section. The assignment involves designing and developing a website for a fictitious company called Wizmen Systems providing business solutions and various IT services like e-commerce, payroll, textiles and order booking.

Uploaded by

Muhammad Ahmad
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
55 views

Assignment SESSION (2018-2022) : Submitted by

The document is an assignment submission by Muhammad Ahmad to Sir Mohsin Malik in the Web Design and Development department at Riphah International University Lahore. It includes pictures, code for a website template with navigation bar, carousel, about section and services section. The assignment involves designing and developing a website for a fictitious company called Wizmen Systems providing business solutions and various IT services like e-commerce, payroll, textiles and order booking.

Uploaded by

Muhammad Ahmad
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 10

ASSIGNMENT

SESSION (2018-2022)
DATE : 02-09-2019

Submitted By

Muhammad Ahmad (404633) SAP: (8608)

Submitted To

SIR MOHSIN MALIK

WEB DESIGN AND DEVELOPMENT (WDD)

DEPARTMENT OF COMPUTER SCIENCE

RIPHAH INTERNATIONAL UNIVERSITY, LAHORE


Picture 1:

Picture 2:
Picture 3:

Code:
<!DOCTYPE html>

<html>

<head>

<title></title>

<meta charset="utf-8">

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" type="text/css" href="css/style.css">

<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

<link href="https://fonts.googleapis.com/

css2?family=Bree+Serif&display=swap" rel="stylesheet">

</head>

<body>

<nav class="navbar navbar-expand-lg navbar-dark bg-dark">

<a class="navbar-brand" href="#">Wizmen Systems</a>

<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="navbarSupportedContent">

<ul class="navbar-nav ml-auto">

<li class="nav-item active">

<a class="nav-link" href="index.php">Home <span class="sr-only">(current)</span></a>

</li>

<li class="nav-item">

<a class="nav-link" href="">Services</a>

</li>

<li class="nav-item">

<a class="nav-link" href="about.php">About</a>

</li>

<li class="nav-item">

<a class="nav-link" href="#">Contact</a>


</li>

<li class="nav-item dropdown">

<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-


toggle="dropdown" aria-haspopup="true" aria-expanded="false">

Dropdown

</a>

<

</div>

</li>

</ul>

<form class="form-inline my-2 my-lg-0">

<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-


label="Search">

<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>

</form>

</div>

</nav>

<div id="demo" class="carousel slide" data-ride="carousel">

<ul class="carousel-indicators">

<li data-target="#demo" data-slide-to="0" class="active"></li>

<li data-target="#demo" data-slide-to="1"></li>

<li data-target="#demo" data-slide-to="2"></li>


</ul>

<div class="carousel-inner">

<div class="carousel-item active">

<img src="images/p1.jpg" width="1100" height="500">

<div class="carousel-caption">

<h3>ERP CABINS</h3>

</div>

</div>

<div class="carousel-item">

<img src="images/p2.jpg" width="1100" height="500">

<div class="carousel-caption">

<h3>MANAGER ROOM</h3>

</div>

</div>

<div class="carousel-item">

<img src="images/p3.jpg" width="1100" height="500">

<div class="carousel-caption">

<h3>RECEPTION</h3>

</div>

</div>

</div>

<a class="carousel-control-prev" href="#demo" data-slide="prev">


<span class="carousel-control-prev-icon"></span>

</a>

<a class="carousel-control-next" href="#demo" data-slide="next">

<span class="carousel-control-next-icon"></span>

</a>

</div>

<SECTION class= "my-5">

<div class="py-5">

<h2 class= "text-center">About Us</h2 text-light>

</DIV>

<div class="container-fluid">

<div class="row">

<div class="col-lg-6 col-md-6 col-12">

<img src="images/p4.jpg" class="img-fluid aboutimg">

</div>

<div class="col-lg-6 col-md-6 col-12">

<h2> Providing best business solution for growing your business</h2>

<p> Wizmen Systems has been organized on professional lines with Project managers,
System architects, software designers, developers, documentation writers, independent quality
assurance teams, trainers and configuration management personnel.Our Functional consultants
team comprises of chartered accountants, Financial Analyst and Cost Accountants.They have
well defined roles and responsibilities to carry out the various necessary steps of software
projects design and engineering to ensure good team work, coordination, and timely product
delivery.</p>
<p>

The company has highly experienced educated and skilled humanr resources. Our key personnel
has vast experience and vission of diversified business domains and software methodologies. We
believe in employing hihly professional and experienced staff for all jobs, project management,
architecture, design, development and QA.

</p>

<a href="about.php" class ="btn btn-outline-success"> want to know more?</a>

</div>

</div>

</SECTION>

<SECTION class= "my-5">

<div class="py-5">

<h2 class= "text-center">Services</h2 text-light>

</DIV>

<div class="container-fluid">

<div class="row">

<div class="col-lg-4 col-md-4 col-12">

<div class="card">

<img class="card-img-top" src="images/p5.jpg" alt="Card image">

<div class="card-body">

<h4 class="card-title">E-COMMERCE SERVICES</h4>

<a href="Services.php" class="btn btn-primary">See Profile</a>

</div>
</div>

</div>

<div class="col-lg-4 col-md-4 col-12">

<div class="card">

<img class="card-img-top" src="images/p6.png" alt="Card image">

<div class="card-body">

<h4 class="card-title">PAY-ROLL SERVICES</h4>

<a href="Services.php" class="btn btn-primary">See Profile</a>

</div>

</div>

</div>

<div class="col-lg-4 col-md-4 col-12">

<div class="card">

<img class="card-img-top" src="images/p7.png" alt="Card image">

<div class="card-body">

<h4 class="card-title">TEXTILE SERVICES</h4>

<a href="Services.php" class="btn btn-primary">See Profile</a>

</div>

</div>

</div>

<div class="col-lg-4 col-md-4 col-12">

<div class="card">
<img class="card-img-top" src="images/p8.jpg" alt="Card image">

<div class="card-body">

<h4 class="card-title">ORDER-BOOKING SERVICES</h4>

<a href="Services.php" class="btn btn-primary">See Profile</a>

</div>

</div>

</div>

</div>

</div>

</section>

You might also like