Bootstrap 4 Concepts & Setup | BOOTSTRAP 4 TUTORIAL


Welcome to this video. Great to have you on board. In this and the next videos of this mini-series here I wanna dive into Bootstrap 4. Which of course leads us to the question. what is Bootstrap 4? It’s a CSS framework. And in this video, I wanna clarify what exactly it is, what it offers us, what makes up a CSS framework., and how we can add it to our next project, to our next website. Before we then later in the series dive into some of its features learn how to use them and build a tiny little website. At least the front of it, with it. So let’s get started. So I already mentioned: Bootstrap is a CSS framework. But what does this actually mean? What is a CSS framework? While you obviously know that CSS stands for cascading stylesheets and is used to style our website. and typically We do style a website by assigning styles to selectors, like element or class selectors. And often you just write a bunch of classes which you then attach to your HTML elements to make them look in a certain way. Now, there is nothing wrong with that approach. But of course, the downside of this is (that) You have to write all the rules all the styles on your own. And this can become pretty cumbersome. CSS frameworks like Bootstrap are there for you to help you. They provide a lot of default styles and a rich set of pre-styled classes, CSS classes. which you can add to your HTML elements to get certain styles and certain looks on your page. It is especially great for quick prototyping but it’s also great for production-ready apps which you want to just give a certain style and where you don’t want to write all the styling on your own. Now to be precise, Bootstrap covers mainly 3 things The first is: some default styles It sets up a default font size Or in general, some default font sizes Default paddings, margins, colors. So a lot of default styling applied to headings, paragraphs, and so on. Besides that, it also offers a rich set of pre-defined CSS classes. And I will dive deeper into what is this in just a second. Now, the third big thing it (does?) is the grid. The idea behind the grid is that you can lay out your page with such a grid. Because if you think about a page, you will basically notice that you can think of it as rows and columns. Any Bootstrap gives an easy-to-use grid which you define by using HTML elements with certain CSS classes and where the things will then be positioned correctly automatically Bootstrap stylings.

42 Comments

Add a Comment

Your email address will not be published. Required fields are marked *