CSS Flashcards
What are the names of the individual pieces of a CSS rule?
Selector, declaration block, property:value
In CSS, how do you select elements by their class attribute?
Using . notation ex) .class
In CSS, how do you select elements by their type?
Using element names ex) h1, h2
In CSS, how do you select an element by its id attribute?
Using #id ex) #html
What CSS properties make up the box model?
Border, margin, padding
Which CSS property pushes boxes away from each other?
Margin
Margin
Which CSS property add space between a box’s content and its border?
Padding
What is the default flex-direction of a flex container?
Row (which goes left to right)
What is the default flex-wrap of a flex container?
Nowrap
All flex items being in one line
Why do two div elements “vertically stack” on one another by default?
Divs are block elements
And thus makes new blocks
What is the default flex-direction of an element with display: flex?
Row - Left to right
What is a pseudo-class?
specifies a special state of the selected element(s)
Classes applied by the browser on certain conditions
What are CSS pseudo-classes useful for?
Applying styling as a result of user interaction
Name at least two units of type size in CSS.
Rem
Pixels
Percentages
point
What CSS property controls the font used for the text inside an element?
font-family
Name three different types of values you can use to specify colors in CSS.
RGB values - (values of 0-255)
How much red, green, and blue are used to make it up
Hex codes
6 digit codes that represent red, blue, green in a color preceded by a pound or hash#
Color Names
There are 147 predefined color
What are the four components of “the Cascade”.
Source order, specificity, inheritance, important rule
What does the term “source order” mean with respect to CSS?
Whatever class is coded last within the element, that will be cascaded
How is it possible for the styles of an element to be applied to its children as well without an additional CSS rule?
inheritance
List the three selector types in order of increasing specificity.
element
class
id
Why is using !important considered bad practice?
It overrides everything
The transition property is shorthand for which four CSS properties?
transition-property, transition-duration, transition-timing-function, and transition-delay
What does the transform property do?
The transform CSS property lets you rotate, scale, skew, or translate an element
Syntax
transform(rotate)
Give four examples of CSS transform functions.
Matrix Translate Scale Rotate Skew
translateY() CSS function repositions an element vertically on the 2D plane. Its result is a data type.