Scribd
Upload
183 views3 pages

SVKM's NMIMS University Mukesh Patel School of Technology Management & Engineering

Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains CSS and JavaScript components for interfaces such as buttons, forms, navigation, and layout. Students are asked to create a portfolio website about themselves using Bootstrap that includes pages for their home, about, resume, projects, and contact information. They must submit the code and output of their website.

Uploaded by

ritika sahu
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
183 views3 pages

SVKM's NMIMS University Mukesh Patel School of Technology Management & Engineering

Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains CSS and JavaScript components for interfaces such as buttons, forms, navigation, and layout. Students are asked to create a portfolio website about themselves using Bootstrap that includes pages for their home, about, resume, projects, and contact information. They must submit the code and output of their website.

Uploaded by

ritika sahu
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

SVKM’s NMIMS University

Mukesh Patel School of Technology Management & Engineering

MCA SEMESTER III

SUBJECT: Web Technologies Practical Assignment: 5


Part A (To be referred by students)

Topic: Working with Bootstrap

Aim: Creating an website using Bootstrap


Theory:
What is Bootstrap?

Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-
end web development. It contains CSS- and JavaScript-based design templates for
typography, forms, buttons, navigation, and other interface components.

Bootstrap is a HTML, CSS & JS Library that focuses on simplifying the development of
informative web pages (as opposed to web apps). The primary purpose of adding it to a web
project is to apply Bootstrap's choices of color, size, font and layout to that project. As such,
the primary factor is whether the developers in charge find those choices to their liking. Once
added to a project, Bootstrap provides basic style definitions for all HTML elements. The
result is a uniform appearance for prose, tables and form elements across web browsers. In
addition, developers can take advantage of CSS classes defined in Bootstrap to further
customize the appearance of their contents. For example, Bootstrap has provisioned for light-
and dark-colored tables, page headings, more prominent pull quotes, and text with a
highlight.

Bootstrap also comes with several JavaScript components in the form of jQuery plugins.
They provide additional user interface elements such as dialog boxes, tooltips, and carousels.
Each Bootstrap component consists of an HTML structure, CSS declarations, and in some
cases accompanying JavaScript code. They also extend the functionality of some existing
interface elements, including for example an auto-complete function for input fields

The most prominent components of Bootstrap are its layout components, as they affect an
entire web page. The basic layout component is called "Container", as every other element in
the page is placed in it. Developers can choose between a fixed-width container and a fluid-
width container. While the latter always fills the width of the web page, the former uses one
of the five predefined fixed widths, depending on the size of the screen showing the page:

 Smaller than 576 pixels


 576–768 pixels
 768–992 pixels
 992–1200 pixels
 Larger than 1200 pixels
Once a container is in place, other Bootstrap layout components implement a CSS Flexbox
layout through defining rows and columns.
A precompiled version of Bootstrap is available in the form of one CSS file and three
JavaScript files that can be readily added to any project. The raw form of Bootstrap, however,
enables developers to implement further customization and size optimizations. This raw form
is modular, meaning that the developer can remove unneeded components, apply a theme and
modify the uncompiled Sass files.

Bootstrap Version 5 Features

 jQuery was removed


 Switch to Vanilla JavaScript
 Responsive Font Sizes
 Drop Internet Explorer 10 and 11 support
 Change of gutter width unit of measurement
 Removed Card Decks
 Navbar Optimization
 Custom SVG icon library
 Switching from Jekyll to Hugo
 Class updates

Link for Bootstrap


https://getbootstrap.com/

Template link for Bootstrap

https://bootstrapmade.com/

Programs:
Create a portfolio website for yourself. You can use any template which are available for free
or you can design it by yourself. Try to include following.
 Home- which should have your picture and name and designation
 About- which should have personal details like date of birth, age, contact details,
hobbies etc..
 Resume-it should have educational details and details about any certificate course or
any achievements.
 Project- Mention details about projects undertaken by you.
 Contact- design a contact form

For reference you can refer the following link


https://bootstrapmade.com/demo/iPortfolio/
https://bootstrapmade.com/demo/MyResume/
https://bootstrapmade.com/demo/Kelly/

Many more examples are available on https://bootstrapmade.com

Part B (to be completed by students)


(Students must submit the soft copy as per the following segments. Save
your file as Rollno_Name_Practical3)

Roll no.: Name:


Class: Batch:
Date of Experiment: Date of Submission:

1. Program scenario and Program code: (Paste you program code )


2. Output: (Paste Output of all web pages)
3. Observation learning and conclusion: mention what learning you got out
of practical
4. Questions:
1. Which of the following class in Bootstrap is used to provide a
responsive fixed width container?
a. .container b. .container-fluid c. .container-fixed

2. How many columns are allowed in a bootstrap grid system?


a. 6 b. 12 c. 8 d.3
3. Which of the following is correct about Bootstrap?
a. Bootstrap is a sleek, intuitive and powerful, mobile first front-
end framework for faster and easier web development
b. It uses HTML, CSS and Javascript
c. Bootstrap 5 have removed the support for JQuery
d. All of the above

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy