CSS 1 Flashcards
What are the names of the individual pieces of a CSS rule?
selector and declaration block with property name: value
In CSS, how do you select elements by their class attribute?
. dot followed by class name
In CSS, how do you select elements by their type?
name of the element
In CSS, how do you select an element by its id attribute?
# hashtag followed by id name
Name three different types of values you can use to specify colors in CSS.
color keywords “black”, RGB color values “rgb(0, 0, 0)”, Hexadecimal color values “#000000”
What CSS properties make up the box model?
content, padding, border, margin
Which CSS property pushes boxes away from each other?
margin
Which CSS property adds space between a box’s content and its border?
padding
What is a pseudo-class?
a selector, choosing only elements in a special state, such as “:hover” or “:first-child”
What are CSS pseudo-classes useful for?
They allow you to apply a style to an element in relation to external factors, such as if the mouse is over an element or target the first child element
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 (from left to right)
What is the default flex-wrap of a flex container?
nowrap
Why do two < div > elements “vertically stack” on one another by default?
< div > elements are block-level
What is the default flex-direction of an element with display: flex?
row (from left to right)
What does box-sizing: border-box do?
allows for padding andborderto be included in an element’s total width and height
What is the default value for the position property of HTML elements?
static
How does setting position: relative on an element affect document flow?
document flow does not adjust
How does setting position: relative on an element affect where it appears on the page?
where it appears with only “position: relative” does not change
How does setting position: absolute on an element affect document flow?
an element gets removed completely from doc flow
How does setting position: absolute on an element affect where it appears on the page?
element appears in first non-static parents
What is the purpose of using “position: absolute”?
Layering elements
How do you constrain an absolutely positioned element to a containing block?
use “position: non-static” or “relative” on containing block
What are the four box offset properties?
top, right, left, bottom
What does “position: fixed” do?
element is glued to the viewport, can’t be moved by scrolling
