Bootstrap CSS Tutorial Videos for Beginner

1
CATCH EXPERTS
https//www.catchexperts.com
http//www.courseing.com
2
Bootstrap CSS Tutorial Videos for Beginners by
3
Highlights

• Typography
• Buttons
• Forms
• Helpers classes
• Images
• Tables

4
Typography

• The style and appearance of written content on
  web pages.
• Bootstrap includes simple and easily customized
  typography
• Typography is applicable for headings, body text,
  lists, and more.
• Bootstrap typography includes heading tags lth1gt
  to lth6gt, ltsmallgt elements to create a lighter,
  secondary text, ltmarkgt element to highlight
  particular text.
• .lead, .small, .text-left or right or centre,
  .text-justify, .list-inline are some typography
  classes.

5
Buttons

• Bootstrap provides seven styles of buttons, they
  are default, primary, link, success, info,
  warning, danger.
• .btn-default, .btn-primary, .btn-success,
  .btn-info, .btn-warning, .btn-danger, .btn-link
  are classes of those buttons.
• Syntax ltbutton type"button" class"btn
  btn-default"gtDefaultlt/buttongt
• .btn lg, .btn md, .btn sm, .btn xs are the sizes
  of buttons.
• Syntax ltbutton type"button" class"btn
  btn-primary btn-lg"gtLargelt/buttongt

6
Forms

• Bootstrap provides several form control styles,
  layout options, and custom components for
  creating a wide variety of forms.
• Vertical form, In-line form, Horizontal form are
  various form types.
• Vertical forms add a role form to the parent
  ltformgt element.
• Inline forms uses create a form where all of the
  elements are inline, left aligned and labels are
  alongside, add the class .form-inline to the
  ltformgt tag.
• Horizontal forms stands apart from the others not
  only in the amount of markup, but also in the
  presentation of the form.

7
Helpers Classes

•  Uses to show or hide information by device via
  media queries.
• .text-muted, .text-primary, .text-success,
  .text-info, .text-warning, .text-danger are text
  helper classes adds meaning through text-colors.
• .bg-primary, .bg-success, .bg-info, .bg-warning,
  .bg-danger are the background helper classes
  which adds meaning through background-colors.
• Also it has response utilities and hidden
  elements to show and/or hide content by devices.

8
Images

• Bootstrap CSS provides various classes to change
  the images styles.
• .img-rounded, .img-circle, .img-thumbnail,
  .img-responsive are the classes to style images.
• Rounded image class Adds rounded corners to an
  image, circle image class shapes the image to a
  circle, thumbnail class Shapes the image to a
  thumbnail.
• Responsive image class makes an image responsive.
• Syntax ltimg srcteddy.jpg" class"img-responsive
  " altTeddy Bear"gt 

9
Tables

• CSS Table classes is used to style the tables
  created on web pages.
• .table, .table-striped, .table-bordered,
  .table-hover, .table-condensed are classes used
  to style the tables.
• Table class adds fundamental styling to the
  tables, table-striped adds zebra striping to any
  table row within lttbodygt , table-bordered adds
  border on all sides of the table and cells,
  .table-hover enables a hover state on table rows
  within a lttbodygt, table condensed Makes table
  more compact by cutting cell padding in half.

10
Feedback
Like It ? Hate It?
We would love to hear from you whatever you think
about the course.
Click HERE to share what you think!
11
Thank you
Thank You for Watching Bootstrap CSS Tutorial
Videos for Beginner by
http//www.courseing.com