CSS

Question 1

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

Answer 1

declaration block, selector, property, value

Question 2

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

Answer 2

.name of the class

Question 3

In CSS, how do you select elements by their tag name?

Answer 3

name of the tag

Question 4

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

Answer 4

name of the id

Question 5

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

Answer 5

color codes, color name, and rgb values.

Question 6

What CSS properties make up the box model?

Answer 6

height, width, border, margin, and padding

Question 7

Which CSS property pushes boxes away from each other?

Answer 7

margin

Question 8

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

Answer 8

padding

Question 9

What is a pseudo-class?

Answer 9

a selector that chooses elements that are in a specific state.

Question 10

What are CSS pseudo-classes useful for?

Answer 10

To make things easier for us when we are coding and want to choose something specific.

Question 11

Name two types of units that can be used to adjust font-size in CSS.

Answer 11

rem and px

Question 12

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

Answer 12

font-family

Question 13

What should you use to resize font?

Answer 13

rem not em.

Question 14

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

Answer 14

flex

Question 15

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

Answer 15

wrap

Question 16

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

Answer 16

it’s a block element (block elements can’t be next to each other. inline elements can be together.)

Question 17

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

Answer 17

row

Question 18

What are the three primary components of a page layout? (Which helper classes do you need?)

Answer 18

container, column, and row

Question 19

What is the minimum number of columns that you should put in a row?

Answer 19

1

Question 20

What is the purpose of a container?

Answer 20

To group rows and columns easier. (basically an outline.)

Question 21

What is the purpose of a row class?

Answer 21

they’re vertical chunks of the page. (sectioning off different parts of the container.)

Question 22

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

Answer 22

static

Question 23

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

Answer 23

it has no effect on document flow. you can move it anywhere.

Question 24

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

Answer 24

move relative to where it would normally exist in static form.

Question 25

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

Answer 25

it disappears from the document flow.

Question 26

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

Answer 26

its boundaries are set by the container it is set in.

Question 27

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

Answer 27

it goes to the first non static ancestor. (AKA position: relative;)

Question 28

What are the four box offset properties?

Answer 28

top, bottom, left, and right

Question 29

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

Answer 29

min width and max width.

Question 30

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

Question 31

What is a breakpoint in responsive Web design?

Question 32

What is the advantage of using a percentage (e.g. 50%) width instead of a fixed (e.g. px) width for a “column” class in a responsive layout?