CSS Flashcards

1
Q

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

A

Selector → the element ex: p {} and a declaration: contain a property and a value ex: font-family:Arial;

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

.element

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

Just the name if the element retrieved

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 name

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

Name three different types of values you can use to specify colors in CSS.

A

Hex code, rgb function,name color

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, margins, 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 property

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

What is a pseudo-class?

A

Classes that are applied based on a certain state or anything that is happening, that is put by the browser.

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

Name at least two units of type size in CSS.

A

Erm and em

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
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
12
Q

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

A

Horizontal in a row

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

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

A

no wrap

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

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

A

Block elements

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

What is the default value for the position property of HTML elements?

A

Static, no behavior -> normal document flow

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

How does setting position: relative to an element affect document flow?

A

Does Not change document flow in any way

17
Q

How does setting position: relative on an element affect where it appears on the page?

A

No effect

18
Q

How does setting position: absolute on an element affect document flow?

A

Removed from the document flow, done from the document flow , to position elements on top of other elements

19
Q

How does setting position: absolute on an element affect where it appears on the page?

A

The absolute element appears on the page within the nearest non-static positioned element.

20
Q

How do you constrain an absolutely positioned element to a containing block?

A

Set it to something other than static

21
Q

What are the four box offset properties?

A

Top-bottom left right

22
Q

What are the four components of “the Cascade”.

A

source order, specificity, inheritance

23
Q

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

A

Styling that is lower takes precedence of properties that are higher

24
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

25
Q

List the three selector types in order of increasing specificity.

A

type, class, id

26
Q

Why is using !important considered bad practice?

A

To make code and rules reusable.

27
Q

What does the transform property do?

A

lets you rotate, skew, scale, etc. on the coordinate space of the CSS model

28
Q

Give four examples of CSS transform functions.

A

rotate. skew, scale, matrix

29
Q

Give two examples of media features that you can query in an @media rule.

A

min-width, max-width

30
Q

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

A

viewport