Bootstrap 3 Tutorial Pt.1 – Intro & How to Install Bootstrap 3

Home Page:
Source files:

In this video, we give an introduction of Bootstrap and a detailed tutorial on how to install Bootstrap 3.

Bootstrap is the most popular front-end framework for developing responsive, mobile first projects on the web.

Video Highlights:

0:11 – Introduction of Bootstrap
0:41 – Accessing getBootstrap to look at some examples
0:52 – Examples of templates that are built with Bootstrap
1:30 – How to download Bootstrap from getBootstrap
2:07 – We go over the contents of the downloaded folder
3:23 – How to install the default Bootstrap template
4:28 – An overview of the HTML code
5:22 – Testing the Bootstrap installation

Original source

29 responses to “Bootstrap 3 Tutorial Pt.1 – Intro & How to Install Bootstrap 3”

  1. @BootstrapBay, I'm using Bootstrap with windows 10 and to edit the text i'm using Sublime Text 2. Do you have any other recommendations as to which text editors I can use? Please and thank you.

  2. Hi in the Tutorials Pt2. Responsive Nabar with Dropdown Menus, can you add and show me the dummy image and a button along with the header. We really dont know what we are missing. The alingment is not coming properly. Your demo will help lot of people to rectify this issue. 99% of the videos are showing only the Header name without the image and the button. Your demo will really help us.

  3. hi there, I learned a lot from your tutorials, i'm beginer so i have some problems.

    I need help with grids in Bootstrap, i have 3 columns in horizontal order in my site, problem is that when I shrink size of IE ex. to 120% the rows begin to differ in size and is not looking good, second issue is that h2 title does not fit in the column. when i resize page for smaller devices. Can u help PLS ?

    <div class="col-sm-6 col-md-4">
        <div class="thumbnail content-wraper">
          <img src="img/aims.png" alt="service">
          <div class="caption">
            <h2 style="text-align: center;">AIMS</h2>
            <p style="font-size:16px; line-height:1.5;">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>

    .content-wraper {
      padding: 15px;

Leave a Reply