CSS Flashcards

1
Q

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

A

selector (selector group)and declaration block

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

a dot follow by the value of the class attribute

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 type the 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

a # pound sign followed by the value of the id attribute

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

Color names, RGB values, and Hex codes. (also HSL functional notation)

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

What is a pseudo-class?

A

A CSS pseudo-class is a keyword added to a selector which allows you to apply a style or functionality to the element when a user interacts with it.

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

What are CSS pseudo-classes useful for?

A

Links, buttons, form controls.

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

What CSS properties make up the box model?

A

Margin, border and padding.

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

Which CSS property add 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
11
Q

Name at least two units of type size in CSS.

A

Pixels, % percentages, ems.

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 div elements are block level element.

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

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

A

Row

17
Q

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

A

Static

18
Q

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

A

It would still be in normal flow

19
Q

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

A

It would take its place in the normal flow first, then the position can be changed by using top, bottom, left and right properties.

20
Q

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

A

The element will be taken out from the normal flow.

21
Q

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

A

It would appear on the top left of the parent container.

22
Q

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

A

Set the position property of containing block anything other than static. (like absolute, relative, fixed, and sticky)

23
Q

What are the four box offset properties?

A

Top, bottom, left and right.