Free Bootstrap Introduction Training videos for Beginners - PowerPoint PPT Presentation


PPT – Free Bootstrap Introduction Training videos for Beginners PowerPoint presentation | free to download - id: 85371a-Y2IyN


The Adobe Flash plugin is needed to view this content

Get the plugin now

View by Category
About This Presentation

Free Bootstrap Introduction Training videos for Beginners


Courseing free bootstrap introduction tutorial covers basic bootstrap concepts like bootstrap overview,bootstrap grid,downloading JqueryUI for bootstrap,rows, columns,containers and nesting columns and rows which is designed for beginners by experts to acquire good knowledge on bootstrap. – PowerPoint PPT presentation

Number of Views:134


Write a Comment
User Comments (0)
Transcript and Presenter's Notes

Title: Free Bootstrap Introduction Training videos for Beginners

Free Bootstrap Introduction Training Videos for
Beginners by
  • Bootstrap Overview
  • Bootstrap Grid
  • jQuery UI Bootstrap Downloading
  • Rows, Columns, Containers
  • Nesting Columns and Rows

Bootstrap Overview
  • It is a framework that uses to create responsive
    mobile sites and applications.
  • Includes HTML,CSS, JavaScript coding.
  • Provides faster and easier web development.
  • Can create responsive layout with less efforts.
  • To learn bootstrap first one should have
    knowledge on HTML and CSS.

Bootstrap Grid
  •  Grid is a two dimensional structure made up of
    intersecting straight lines used to structure the
  • Uses to design layout and content structure and
    it is very effective.
  • Includes predefined classes for easy layout
  • Provides powerful mixins for generating more
    semantic layouts.
  • creates page layouts through a series of rows and

JQuery UI Bootstrap Downloading
  • Search for Bootstrap compatible with JQuery UI.
  • Before installing select JS components like
    modals, dropdowns, collapse, carousel.
  • Also select twitter bootstrap components like
    transitions, dropdowns, modals, scrollspy,
    togglable tags, affix, alert messages, typeahead,
    collapse, carousel.
  • Provides Bootstrap theming for a number of third
    party jQuery UI widgets

JQuery UI Bootstrap Downloading
  • Now Download archive file.
  • Unzip archive
  • Locate the folder custom-theme inside the CSS
    folder inside the newly uncompressed file
  • Move that folder inside the directory of the
    website of you are working.
  • Include the appropriate .CSS files in the layout
    of your website

Rows, Columns, Containers
  • Bootstrap builds layouts based on 12 column
    layout and has multiple tiers.
  • Containers, rows, and columns are the bootstrap
    major components.
  • Rows are horizontal groups of columns, will be
    placed within a .container or .container-fluid.
  •  .container and .container-fluid provides proper
    alignment and padding.
  • columns may be immediate children of rows and
    Content should be placed within columns.

Nesting Columns and Rows
  • Example for nesting one row and three equal
    columns is follows as
  • Syntax ltdiv class"row"gt  
    ltdiv class"col-sm-1"gt.col-sm-1lt/divgt   
    ltdiv class"col-sm-1"gt.col-sm-1lt/divgt  
      ltdiv class"col-sm-1"gt.col-sm-1lt/divgt

Like It ? Hate It?
We would love to hear from you whatever you think
about the course.
Click HERE to share what you think!
Thank you
Thank You for Watching Free Bootstrap
Introduction Training Videos for Beginner by