Section 1

Preview this deck

What is CSS Box Model and what are its elements?

Front

Star 0%
Star 0%
Star 0%
Star 0%
Star 0%

0.0

0 reviews

5
0
4
0
3
0
2
0
1
0

Active users

0

All-time users

0

Favorites

0

Last updated

6 years ago

Date created

Mar 1, 2020

Cards (12)

Section 1

(12 cards)

What is CSS Box Model and what are its elements?

Front

The box defines the design and layout of CSS elements. The elements are margin, padding, border, content.

Back

What is SCSS

Front

Back

What is an External Style Sheet?

Front

A stylesheet that can be used to format your entire website.

Back

What is graceful degradation?

Front

A paradigm in web design where we first provide the experience for modern/advanced browsers, and then work on providing a more basic version for older, less-capable users (e.g. providing an `alt` tag for an image).

Back

What is Less?

Front

Leaner style sheets.

Back

What is the difference between `inline` and `inline-block`?

Front

`inline-block` is similar to `inline`, but allows you to provide a height, width, and vertical margin to the element.

Back

How to center elements on a page?

Front

1. Use Flexbox (justify-content and align-items) 2. `margin: 0 auto` 3. Use transform with a negative translate of 50% in both directions (which is based on current width/height of the element) `position: absolute top: 50% left: 50% transform: translate(-50%, -50%)`

Back

What is an Embedded Style Sheet?

Front

Styling placed directly inside the <head> of an HTML doc using the <style> tag. No extra download of an external file is necessary when styling is defined this way, but it makes it impossible to control the styling for multiple pages.

Back

What is a CSS selector?

Front

Basically a string that identifies the element to which the style applies.

Back

What is Sass?

Front

Syntactically awesome style sheets.

Back

What is the difference between responsive and adaptive design?

Front

Both change the appearance of a webpage based on the browser environment. However, responsive sites respond to the size of the browser at ANY given point; adaptive sites adapt to the size of the browser at SPECIFIC points. Think of the difference between smooth and snap design. Responsive layouts fluidly adjust, adaptive layouts snap into place at certain breakpoints. Adaptive requires creating several distinct layouts for different screen sizes, which can result is slower load times because the site has to load all of your layouts and then decide which one to use.

Back

Why avoid using float?

Front

Because floats were never intended for layout; they were meant for one purpose, to allow text to wrap around an image (float pulls the element out of the normal document flow). They don't behave intuitively. Desired layouts can be achieved without float using `inline-block` or Flexbox.

Back