CSS Flashcards
What are the names of the individual pieces of a CSS rule?
The selector and declaration block.
In CSS, how do you select elements by their class attribute?
You put a . in front of the name of the class.
In CSS, how do you select elements by their type?
The name of the element.
In CSS, how do you select an element by its id attribute?
in front of the attribute.
Name three different types of values you can use to specify colors in CSS.
RGB values, hex codes, and color names.
What CSS properties make up the box model?
Margins, borders, padding, and the content.
Which CSS property pushes boxes away from each other?
Margin
Which CSS property add space between a box’s content and its border?
Padding
What is a pseudo-class?
A keyword added to a selector that specifies a special state of the selected element.
What are CSS pseudo-classes useful for?
Styling an element when a user mouses over it. Makes the web page feel more interactive.
Name two types of units that can be used to adjust font-size in CSS.
Px and em
What CSS property controls the font used for the text inside an element?
Font-family
What is the default flex-direction of a flex container?
row
What is the default flex-wrap of a flex container?
nowrap
Why do two div elements “vertically stack” on one another by default?
They are block elements, so they take up the width of their container.
What does the transform property do?
Rotates, scales, skews or translates an element.
Give four examples of CSS transform functions.
Rotate, scale, translate, skew.
What is the default value for the position property of HTML elements?
Static
How does setting position: relative on an element affect document flow?
Moves an element from the position it would be from normal flow, and doesn’t affect the positioning of surrounding elements.
How does setting position: relative on an element affect where it appears on the page?
It allows us to move the element.
How does setting position: absolute on an element affect document flow?
No longer exists in normal document flow. Positions the element in relation to its containing element.
How does setting position: absolute on an element affect where it appears on the page?
Absolutely positioned elements move as users scroll up and down the page.
How do you constrain an absolutely positioned element to a containing block?
Non-static ancestor elements.
What are the four box offset properties?
top, bottom, left, and right
