Bootstrap Tutorial for Beginners

This video series are for those who wants to learn bootstrap by starting and also for beginners
3.7 (23 ratings) Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
960 students enrolled
Free
Start Learning Now
  • Lectures 20
  • Length 2 hours
  • Skill Level Beginner Level
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 2/2016 English

Course Description

This course is about Bootstrap and its basic structure and classes and all that things which are really useful for who wants to work with this and don't have an idea about bootstrap.

by this course students will be able to work in development and designing.

This course is not too much long but all useful things are covered in this course.

Every web developer should know how to properly code a responsive website. Bootstrap 3 is an ultimate framework that learns you how to think when coding responsive websites and makes their creation much easier and faster.

Why we choose Bootstrap??

It's a very popular, well designed, open source UI framework
CSS wrappers for many Javascript components
•modal windows, typeahead, tooltips, etc.
Mobile-first design
•Bootstrap 3.0 is in the vanguard of responsive, mobile-first UI design frameworks

This list of some Bootstrap classes with some description which i explained in this video series

.container

  • sets fixed width to an element (which changes depending on a screen size to other fixed values, so it's still responsive)
  • a fixed width responsive website should be wrapped in .container
  • .container can't be nested!

.container-fluid

  • sets 100% width, margin-left and margin-right: auto, padding-left and padding-right: 15px
  • a full screen website should be wrapped in .container-fluid
  • .container-fluid can't be nested!

.row

  • creates horizontal groups of columns (which usually have width classes, see below)
  • must be within .container to ensure correct padding and alignment
  • only columns (block elements with width classes) may be immediate children of rows


  • Bootstrap Grid Classes


  • can be nested, the nested columns must be wrapped in .row as well
  • all columns have float: left and position: relative styles






What are the requirements?

  • little bit knowledge of HTML and CSS and also have an editor like notpad, notpad++, visual studio, for the development

What am I going to get from this course?

  • work with web designing

What is the target audience?

  • who will interested in web designing and want to create their own projects

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: Bootstrap introduction and installation
03:24

This video is about bootstrap overview and use and how it is useful for developers.

07:11

This video is for installation of Bootstrap by one method which is via CDN.

03:26

This video is about  package installation of Bootstrap.

05:37

In Visual studio, how to use Bootstrap by nu get package is described in this video

Section 2: Bootstrap Basic classes and Grid system
09:15

Bootstrap basic classes are described by example in this video

07:06

This video is about class of row of grid system of Bootstrap

07:43

This Video is about Column grid system

07:20

In this video i explained about more for breakpoints and offset class

07:05

This video is about how to create nested column and how to ordering the column

Section 3: Bootstrap Button Control and Glyphicon and Form Control
06:51

This video is about button control and how to use this 

02:41

How to add different different glyphicon icons in Bootstrap is discribed in this video

06:11

This video is about how to create a form with a different styles and how to use of it's predefined classes in Bootstrap

03:36

In this video i described the table structure of Bootstrap and gave various kind of style to it

08:25

This video is about creating a Responsive Tabs and for that different styles

02:42
after watching this video students will get an idea about how to create a drop down menu in the webpage
Section 4: Bootstrap Advance Control like Carousel Pagination and Scrollspy Navbar
08:52

How to create a fixed navbar and how to make it collapse for small screen resolution is described nicely in the video

04:28

in this video i explained about the Creation of a list group items with badges and other styles

05:48

carousel is very useful class in creating responsive web page ,this video is about that.

07:13

Number of pages will how to manage with Pagination i explained and also about the importance of pager class 

04:51

In This Video Series This Last video is about Scroll spy class and it's example is described by easy way.

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

I am a software engineer and doing work in private section as a developer

i like my work and also have a passion for that.

being as instructor i feel very happy and this is the best platform for doing best.

by my course i want to share the knowledge which i have and also i wish by that other people will get this and use it in their work.

Ready to start learning?
Start Learning Now