Bootstrap And Susy Quiz

Reviewed by Editorial Team
The ProProfs editorial team is comprised of experienced subject matter experts. They've collectively created over 10,000 quizzes and lessons, serving over 100 million users. Our team includes in-house content moderators and subject matter experts, as well as a global network of rigorously trained contributors. All adhere to our comprehensive editorial guidelines, ensuring the delivery of high-quality content.
Learn about Our Editorial Process
| By Avril_babe
A
Avril_babe
Community Contributor
Quizzes Created: 1 | Total Attempts: 108
| Attempts: 108
SettingsSettings
Please wait...
  • 1/15 Questions

    The Bootstrap grid system is based on how many columns?

    • 6
    • 12
    • 9
    • 14
Please wait...
About This Quiz

This quiz tests knowledge on Bootstrap and Susy, focusing on grid systems, container styles, and framework specifics. It assesses understanding of 12-column layouts in Bootstrap and the flexibility of Susy, enhancing skills in responsive web design.

Bootstrap And Susy Quiz - Quiz

Quiz Preview

  • 2. 

    What is Susy?

    • Sass-based grid framework

    • 12 column grid system

    • JavaScript Extension

    • HTML Extension

    Correct Answer
    A. Sass-based grid framework
    Explanation
    Susy is a Sass-based grid framework that allows developers to easily create responsive grid layouts for their websites. It provides a flexible and customizable grid system with support for different column configurations. By using Susy, developers can efficiently design and organize the layout of their web pages, making them responsive and visually appealing.

    Rate this question:

  • 3. 

    Which one has pre-existing components?

    • Bootstrap

    • Susy

    Correct Answer
    A. Bootstrap
    Explanation
    Bootstrap has pre-existing components.

    Rate this question:

  • 4. 

    You must use ____ to use Susy

    • HTML

    • CSS

    • LESS

    • SASS

    Correct Answer
    A. SASS
    Explanation
    To use Susy, one must use SASS. Susy is a grid framework that is specifically designed to work with SASS, which is a CSS preprocessor. SASS allows for the use of variables, mixins, and other advanced features that make it easier to create and maintain complex CSS stylesheets. By using SASS, developers can leverage the power of Susy to create responsive grid layouts more efficiently.

    Rate this question:

  • 5. 

    Bootstrap is a back-end web framework

    • True

    • False

    Correct Answer
    A. False
    Explanation
    Bootstrap is not a back-end web framework, but rather a front-end web framework. It is used for designing and developing responsive and mobile-first websites. It provides pre-built CSS and JavaScript components that can be easily integrated into web projects, making it easier to create visually appealing and user-friendly interfaces.

    Rate this question:

  • 6. 

    Which file is Susy written in?

    • HTML

    • CSS

    • SCSS

    • JS

    Correct Answer
    A. SCSS
    Explanation
    Susy is a grid framework for Sass, a CSS preprocessor language. SCSS is a file extension for Sass files, indicating that the code is written in the SCSS syntax, which is a superset of CSS. Therefore, Susy is written in SCSS, as it is specifically designed to work with Sass and take advantage of its features.

    Rate this question:

  • 7. 

    Who created Susy?

    • Eric Suzanne

    • Mark Otto

    • Jacob Thornton

    • Bill Gates

    Correct Answer
    A. Eric Suzanne
    Explanation
    Eric Suzanne is the creator of Susy.

    Rate this question:

  • 8. 

    Who created Bootstrap?

    • Jacob Otto & Eric Suzanne

    • Jacob Thornton & Anna Otto

    • Mark Otto & Jacob Thornton

    • Mark Otto & Anna Otto

    Correct Answer
    A. Mark Otto & Jacob Thornton
    Explanation
    Mark Otto and Jacob Thornton are the creators of Bootstrap. They developed Bootstrap as a framework to help streamline the process of building responsive and mobile-first websites. The framework provides a collection of CSS and JavaScript components that can be easily implemented to create a visually appealing and functional website. Mark Otto and Jacob Thornton's collaboration resulted in the creation of Bootstrap, which has become one of the most popular front-end development frameworks in the industry.

    Rate this question:

  • 9. 

    If you want to have 3 equal columns in Bootstrap, which class would you use?

    • Col-md-3

    • Col-md-4

    • Col-md-7

    • Col-md-12

    Correct Answer
    A. Col-md-4
    Explanation
    To have 3 equal columns in Bootstrap, the class "col-md-4" would be used. This class divides the available space into 12 equal parts, and by assigning "col-md-4" to each column, it ensures that each column occupies 4 parts, resulting in 3 equal columns.

    Rate this question:

  • 10. 

    In Bootstrap, content must be placed within...

    • Rows

    • Containers

    • Columns

    Correct Answer
    A. Columns
    Explanation
    In Bootstrap, content must be placed within columns. Columns are used to divide the horizontal space within a row and allow for a responsive layout. By placing content within columns, it ensures that the content will be properly organized and displayed on different screen sizes.

    Rate this question:

  • 11. 

    The Susy grid framework is based on how many columns?

    • 12

    • 10

    • 16

    • The grid is not predefined

    Correct Answer
    A. The grid is not predefined
    Explanation
    The Susy grid framework does not have a predefined number of columns. It allows the user to define the number of columns based on their specific needs and requirements. This flexibility allows for greater customization and adaptability in creating responsive layouts.

    Rate this question:

  • 12. 

    How would you make a full width container in Bootstrap?

    • Container-full

    • Container-fluid

    • Container-width

    • Container-fw

    Correct Answer
    A. Container-fluid
    Explanation
    To create a full-width container in Bootstrap, the correct class to use is "container-fluid". This class ensures that the container spans the entire width of the viewport, making it suitable for creating responsive layouts that fill the entire screen. The other options provided ("container-full", "container-width", "container-fw") are not valid Bootstrap classes and would not achieve the desired result.

    Rate this question:

  • 13. 

    In Bootstrap, rows must be placed within...

    • Columns

    • Containers

    • Sections

    Correct Answer
    A. Containers
    Explanation
    In Bootstrap, rows must be placed within containers. Containers provide a fixed width for the content and center it horizontally on the page. They ensure that the content is properly aligned and displayed within a consistent layout. By placing rows within containers, the content can be organized into a grid system and responsive design can be easily implemented.

    Rate this question:

  • 14. 

    How do you import Susy in your SCSS file?

    • @import "susy";

    • < link href=”css/susy” rel=”stylesheet” >

    • $susy-import;

    • @stylesheet => susy;

    Correct Answer
    A. @import "susy";
    Explanation
    The correct way to import Susy in an SCSS file is by using the "@import" rule followed by the path to the Susy file. In this case, the correct answer is "@import 'susy';".

    Rate this question:

  • 15. 

    What was Bootstrap originally named?

    • Twitter Blueprint

    • Bootstrap Blueprint

    • Twitter Bootstrap

    • Blueprint Bootstrap Twitter

    Correct Answer
    A. Twitter Blueprint
    Explanation
    Bootstrap was originally named "Twitter Blueprint" because it was developed by a team of Twitter employees as an internal tool. However, it was later released as an open-source project under the name "Bootstrap" and gained popularity as a front-end framework for web development.

    Rate this question:

Quiz Review Timeline (Updated): Jul 16, 2024 +

Our quizzes are rigorously reviewed, monitored and continuously updated by our expert board to maintain accuracy, relevance, and timeliness.

  • Current Version
  • Jul 16, 2024
    Quiz Edited by
    ProProfs Editorial Team
  • Nov 08, 2016
    Quiz Created by
    Avril_babe
Back to Top Back to top
Advertisement
×

Wait!
Here's an interesting quiz for you.

We have other quizzes matching your interest.