CSS Flashcards

1
Q

What are the names of the individual pieces of CSS rule?

A

ruleset, selector, declaration block, property/value pair

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

In CSS, how do you select elements by their class attribute?

A

.class {

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

In CSS, how do you select elements by their type?

A

element name {

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

In CSS, how do you select an element by its id attribute?

A

id {

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Name 3 types of values you can use to specify colors in CSS:

A

rgb values( ), #hex codes, colorNames

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

What CSS properties make up the box model?

A

border, margin, padding

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Which CSS property pushes boxes away from each other?

A

margin

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Which CSS property adds space between a box’s content and its border?

A

padding

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

What is a pseudo-class?

A

a keyword added to a selector that specifies a special state of the element

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

What are CSS pseudo-classes useful for?

A

applying event-based styling

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

Name at least two units of type size in CSS:

A

pixels, ems, rems

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

What CSS property controls the font used for the text inside an element?

A

font-family

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

What is the default flex-direction of a flex container?

A

row

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

What is the default flex-wrap of a flex container?

A

nowrap - (all flex items will be on one line)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Why do two div elements “vertically stack” on one another by default?

A

because they’re block-level elements

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

What’s the default flex-direction of an element with display: flex ?

A

row

17
Q

What are the four components of “The Cascade”?

A

source order, inheritance, specificity, !important

18
Q

What does the term “source order” mean with respect to CSS?

A

The styling provided for an element last in the stylesheet is the styling that will ultimately take effect.

19
Q

How is it possible for the styles of an element to be applied to its children as well without an additional CSS rule?

A

inheritance

20
Q

List the three selector types in order of increasing specificity:

A

type selectors, class selectors, id selectors

21
Q

Why is using !important considered bad practice?

A

It makes debugging more difficult by breaking the natural cascading in the stylesheets. Makes it impossible to override that styling.

22
Q

What does the transform property do?

A

lets you change how the element will be shown visually - rotate, scale, skew, translate (changes the shape and position of an element without disrupting normal document flow)

23
Q

Give three examples of CSS transform functions:

A

rotate, translate, scale

24
Q

The transition property is shorthand for which four CSS properties?

A

transition-property, transition-duration, transition-timing, transition-delay

25
Q

Give 2 examples of media features that you can query in an @media rule:

A

min-width

max-width

26
Q

Which HTML meta tag is used in mobile-responsive web pages?

A

the viewport meta tag