Kathford International College of Engineering and

Management
Balkumari, Lalitpur, Nepal

Project Report

on

Responsive Website

Submitted To:

Department of Information Technology

Kathford International College of Engineering and Management

In partial fulfillment of the requirement for the Bachelor Degree in

Computer Science and Information Technology

Submitted By:

Aarya Shree Chapagain (25865)

August 2023
ABSTRACT
Bicycle Shop is a website that is written purely in HTML and CSS. The aim of the
website is to demonstrate all the features provided by just using HTML and CSS
without any JavaScript. The many features provided by HTML such as hyperlinks,
images, icons, inputs, and forms. Additionally, we use semantic HTML tags
introduced in HTML5 as well the modern CSS3 to build the website. This means
using CSS features such as Flexbox and Grid for layouts.
Keywords: Bicycles, Bike, Online Store, Semantic HTML, CSS3

i
ACKNOWLEDGEMENT
I would like to express my sincere gratitude to my instructor, Sarita Neupane, for
their guidance and support throughout this project. Their expertise in HTML and
CSS was invaluable to me, and I am grateful for their patience and encouragement.

ii
TABLE OF CONTENTS

ABSTRACT .............................................................................................................. i
ACKNOWLEDGEMENT .......................................................................................ii
TABLE OF FIGURES ............................................................................................ iv
INTRODUCTION ................................................................................................... 1
HOME PAGE .......................................................................................................... 2
ACCESSORIES ....................................................................................................... 6
BIKES ...................................................................................................................... 6
.................................................................................................................................. 6
SERVICES ............................................................................................................... 7
REGISTER .............................................................................................................. 8
IMPORTANT CODES ............................................................................................ 9
SITE WIDE STYLING........................................................................................ 9
MEDIA QUERIES............................................................................................. 10
................................................................................................................................ 10
NAVIGATION BAR ......................................... Error! Bookmark not defined.
FORM ................................................................................................................ 11
CONCLUSIONS.................................................................................................... 12

iii
TABLE OF FIGURES

FIGURE 1 HOMEPAGE ................................................................................................ 2

FIGURE 2 HOMEPAGE 2 ............................................................................................. 3
FIGURE 3 HOMEPAGE 3 ............................................................................................. 4
FIGURE 4 HOMEPAGE 4 ............................................................................................. 5
FIGURE 5 ACCESSORIES PAGE ................................................................................... 6
FIGURE 6 BIKES PAGE ............................................................................................... 6
FIGURE 7 SERVICES PAGE ......................................................................................... 7
FIGURE 8 SERVICES PAGE ON SMALLER SCREEN ....................................................... 7
FIGURE 9 REGISTER PAGE ......................................................................................... 8
FIGURE 10 SITE WIDE STYLING ................................................................................. 9
FIGURE 11 NAVBAR .................................................................................................. 9
FIGURE 12 MAIN SECTION ....................................................................................... 10
FIGURE 13 FOOTER ................................................................................................. 10
FIGURE 14 MEDIA QUERIES .................................................................................... 10
FIGURE 15 NAVBAR HTML .............................. ERROR! BOOKMARK NOT DEFINED.
FIGURE 16 FORM HTML ........................................................................................ 11

iv
INTRODUCTION
Bicycle Shop is a static website consisting of 5 pages. First, all the pages are divided
into 3 sections – the header, footer, and the main section. The header and footer are
same for all 5 webpages, while the main section differs per page. Most of the CSS
is written in the style.css and some webpage specific CSS is present in some pages.
The five webpages of the website are:
 Homepage
 Bikes
 Accessories
 Services
 Register
.

1
HOME PAGE

Figure 1 Homepage

2
Figure 2 Homepage 2

3
Figure 3 Homepage 3

4
Figure 4 Homepage 4

5
ACCESSORIES

Figure 5 Accessories Page

BIKES

Figure 6 Bikes Page

6
SERVICES

Figure 7 Services Page

Figure 8 Services Page on smaller screen

7
REGISTER

Figure 9 Register Page

8
IMPORTANT CODES
SITE WIDE STYLING

Figure 10 Site wide styling

Figure 11 Navbar

9
 Figure 12 Main section

Figure 13 Footer

MEDIA QUERIES

Figure 14 Media Queries

10
FORM

Figure 15 Form HTML

11
CONCLUSIONS
The bicycle store website project was a success. The website meets all of the
requirements and is responsive, easy to use, visually appealing and was completed
in the set deadline.

12