Learn Bootstrap

Bootstrap

  • Q1. What is Bootstrap?
    Bootstrap is a platform for web development based on a front-end framework. It is used to create exceptional responsive designs using HTML, and CSS. These templates are used for forms, tables, buttons, typography, models, tables, navigation, carousels and images. Bootstrap also has Javascript plugins, which are optional. Bootstrap is mostly preferred for developing mobile web applications.
  • Q2. Explain why Bootstrap is preferred for website development.
    Bootstrap has better features as compared to other web development platforms. It provides extensive browser support for almost every known browser such as Opera, Chrome, Firefox, Safari, etc. If you are well-acquainted with CSS and HTML, web development becomes easy on Bootstrap. Also, it supports mobile applications with the help of responsive design and can adjust CSS as per the device, screen size, etc. Instead of creating multiple files, it creates only a single file reducing the work of a developer.
  • Q3. What are the key components of Bootstrap?
    The key components of Bootstrap include: CSS: It consists of various CSS files Scaffolding: It provides a basic structure with the Grid system, link styles, and background Layout Components: This gives the list of layout components JavaScript Plugins: It contains many jQuery and JavaScript plugins Customize: To get your own version of the framework, you can customize your components
  • Q4. List some features of Bootstrap.
    Some of the features of Bootstrap are: It provides an open-source for use Bootstrap has Compatibility with all browsers It has Responsive designs Easy to use and fast
  • Q5. What are Class loaders in Bootstrap?
    A class loader is a part of JRE or Java Runtime Environment which loads Java classes into Java virtual environment. Class loaders also perform the process of converting a named class into its equivalent binary form.
  • Q6. How many types of layout are available in Bootstrap?
    There are two major layouts for Bootstrap: Fluid Layout- This layout is necessary for creating an app that is 100 % wider and covers all the screen width. Fixed Layout- It is used only for a standard screen (940px). Both layouts can be used for creating a responsive design.
  • Q8. What is Bootstrap Grid System?
    Bootstrap includes a responsive, mobile-first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes predefined classes for easy layout options, as well as powerful mixins for generating more semantic layouts.
  • Q9. Give an example of a basic grid structure in Bootstrap.
    Example of a basic grid structure:
    ...
    ....
  • Q10. Why do we use Jumbotron in Bootstra
    Jumbotron is used for highlighting content in bootstrap. It could either be a slogan or probably a headline. It increases the heading size and gives a margin for the content of the landing page. To implement Jumbotron in a Bootstrap, you have to use: Create a container
    with the class of .jumbotron For example, use
    if you don’t want Jumbotron to reach the screen’s edge.
  • Q11. What are the two codes used for code display in Bootstrap?
    There are two simple ways to display code in Bootstrap: tag: This tag is used to display an inline code. 
     tag: If you have a code with several lines or even a block element, you can display it using this.
  • Q12. Explain the typography and links in Bootstrap.
    Bootstrap sets a basic global display (background), typography, and link styles. Basic Global display − It sets background-color: #fff; on the element. Typography − This uses the @font-family-base, @font-size-base, and @line-height-base attributes as the typographic base Link styles − It sets the global link color via attribute @link-color and applies link underlines only on :hover.
  • Q13. What is a progress bar in bootstrap?
    Progress bar is used with HTML tag style in HTML element using keyword. In bootstrap we use html5 with CSS classes that have special features in bootstrap, that is only made for the progress bar.
  • Q14. How do you make images responsive?
    Bootstrap allows to make the images responsive by adding a class .img-responsive to the tag. This class applies max-width: 100%; and height: auto; to the image so that it scales nicely to the parent element.
  • Q15. What are the steps for creating basic or vertical forms?
    The steps for creating basic or vertical forms include: Add a role form to the parent element Wrap labels and controls in a
    with class .form-group. This is required to achieve optimum spacing Add a class of .form-control to all texturl ,