CSS

Question 1

Names of the CSS rule pieces:

Answer 1

1. Selector
2. Opening/ closing braces
3. Properties
4. Property values

Question 2

How do you select elements by their class attribute?

Answer 2

You place a .class in the selector

Question 3

How do you select elements by type

Answer 3

you place the element type in the selector position

Question 4

how do you select an element by it’s ID?

Answer 4

Use #idName

Question 5

Name three types of values to specify colors:

Answer 5

hex numbers, rgba, and specific color names

Question 6

What CSS properties make up the box model?

Answer 6

Margin, borders, padding, content size. width height

Question 7

Which CSS property pushes boxes away from each other?

Answer 7

margin.

Question 8

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

Answer 8

padding.

Question 9

What is a psuedo-class?

Answer 9

A psuedo-class is a keyword added to a selector that specifies a special state of the selected element.

Question 10

psuedo-class used for?

Answer 10

It’s helpful for making elements on your page respond to interaction

Question 11

Name two units of font size:

Answer 11

em, rem, px.

Question 12

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

Answer 12

font-family

Question 13

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

Answer 13

row

Question 14

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

Answer 14

no-wrap

Question 15

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

Answer 15

div elements are block elements that do not share lines

Question 16

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

Answer 16

row

Question 17

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

Answer 17

static

Question 18

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

Answer 18

it does not interrupt flow but the element remains in the flow

Question 19

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

Answer 19

It appears relative to its original static position.

Question 20

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

Answer 20

It removes it from the flow and places it in an exact position.

Question 21

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

Answer 21

It will place an element exactly where you want it, regardless of whether it clashes with other elements.

Question 22

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

Answer 22

the nearest non static ancestor element will contain and absolute element. Create a block with relative positioning and it will serve as a container.

Question 23

What are the four box offset properties?

Answer 23

top, bottom, left, and right

Question 24

What are the four components of “the Cascade”.

Answer 24

Importance, specificity, source order, proximity

Question 25

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

Answer 25

The order property is designed to lay the items out in ordinal groups. What this means is that items are assigned an integer that represents their group. The items are then placed in the visual order according to that integer, lowest values first. If more than one item has the same integer value, then within that group the items are laid out as per source order.

Question 26

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

Answer 26

you can put two element in the selector group. without a comma, it selects the child element

Question 27

List the three selector types in order of increasing specificity.

Answer 27

.class, #id, inline

Question 28

Why is using !important considered bad practice?

Answer 28

It overrides the other classes and ID’s. It makes debugging more difficult because it breaks normal css.