DEV Community

Cover image for Bootstrap very little essentials!
Candor Dennis
Candor Dennis

Posted on

Bootstrap very little essentials!

As a child, it took a while for me to walk for a while. I dragged my feet so many times in a bid to even stand properly.

This however was because my feet was slightly broken at birth and i had to manage till i was finally able to stand well. The excitement I felt was amazing!

I’ll relate to this story of mine later.

Learning CSS, was for me, from the very beginning really exciting. I was fascinated by the way HTML documents were easily manipulated using this language, how i was able to add colors and create boxes and shadows.. Truly mind blowing.

And then came BOOTSTRAP!

In this article I’ll be explaining what Bootstrap really is and how to use it. I believe you’ll find it as interesting as I still do.

OVERVIEW

Bootstrap is a frontend, open source, free to use, web and mobile responsive framework for building and deploying web pages.

As a frontend language, its components are designed to connect with the user directly, which simply means that it is used for designing web pages.

As an open-sourced language, millions of developers can contribute to it and modify to suit the required design.

Bootstrap is free for anyone to use, anytime… anywhere. Its resources are available.

Bootstrap was built “mobile first” which means that it is responsive across a variety of mobile screen sizes.

Bootstrap is majorly composed of already styles css files, already compiled javascript and jquery files as well as some others like the animate.css and popper.css.

These files are designed to perform specific actions either relating to a certain css feature or javascript feature.

The secret to properly using bootstrap is understanding its components and proper class names that perform specific functions.

To effectively use bootstrap in creating web pages, you can decide to use the online CDN or import and link bootstrap files in your HTML document.

Just like this.

<!DOCTYPE html>
<html>
<head>
<title>Bootstrap practise class</title>
<link rel=”stylesheet” type=”text/css”      href=”bootstrap/css/bootstrap.css”>
<link rel=”stylesheet” type=”text/css” href=”bootstrap/css/style.css”>
</head>
<body>

<div class=”bg-success p-5">
<p class=”text-light display-4 small text-right”>HELLO AND WELCOME TO THIS BOOTSTRAP CLASS</p>
</div>

<script type=”text/javascript” src=”bootstrap/js/popper.js”></script>
<script type=”text/javascript” src=”bootstrap/js/bootstrap.jquery.js”></script>
<script type=”text/javascript” src=”bootstrap/js/bootstrap.js”></script>

</body>
</html>
Enter fullscreen mode Exit fullscreen mode

YOU TOO CAN USE BOOTSTRAP

It’s no longer news that bootstrap has come to stay and you too can learn to use this amazing framework!

In my next article i’ll talk about a very important component of bootstrap and how it forms the basis for everything you will likely build with bootstrap.

MY LITTLE STORY

A few decades down the lane, i still have that excitement i felt the first day i stood.

Well, Bootstrap can give you this feeling if you so desire.

Learn the basics…. Practice……Keep coding.

Top comments (0)