CSS Flashcards
What are the names of the individual pieces of a CSS rule?
selector, properties, values
How are key/value pairs related to CSS?
manifest as property and value
Name three different types of values you can use to specify colors in CSS.
hex values: #0000,
RGB color values: rgb(0.0,0),
HSL(hue, saturation, lightness)
What are three important considerations for choosing fonts?
readability, theme, target market
Why must you have backup fonts assigned when selecting custom fonts?
in case if it doesn’t work or doesn’t have that font
What CSS properties make up the box model?
margin, border, padding
Which CSS property pushes boxes away from each other?
margin: pushes other stuff away
Which CSS property pushes box content away from its border?
padding: give more space within element itself
What purpose does the CSS Cascade serve?
to select CSS declarations in order
What is source order?
the order that your CSS rules are written
In what situation might you need to apply styling to a single element multiple times in one stylesheet?
font-family, or global responsiveness
What is inheritance?
controls what happens when no value is specified for a property on an element
Why might CSS include this feature?
to save you from having to apply these properties to many elements
Is inheritance a good tool to use for styling? if so, on what occasions?
yes, for text
What is the purpose of !important?
to override styles that are declared somewhere else
When is !important a good tool to use?
NEVER
What is specificity?
the means by which browsers decide which CSS property values are the most relevant to an element
How is it calculated?
determined by the number of each selector type in the matching selector
Why might CSS include this feature?
for source order, to have other ways to style
What is the order of selector strengths for CSS specificity, referred to as the Specificity Hierarchy?
Inline style attributes, ID attributes, classes and pseudo classes, elements and pseudo elements, *
What is the CSS Cascade?
styles can fall from one style sheet to another. all factors that CSS uses
What are CSS pseudo-classes useful for?
gives us styling responsible for events
What does the transform property do?
adjust visually on page
What is the difference between the :first-child pseudo selector and the :last-child pseudo selector?
first selects the first element after the parent and last selects the last element of the group
What are 3 examples of what can be done with CSS transitions?
scale, rotate, delay
Why might transitions be a helpful effect for styling?
create animation or ups the user friendliness
Are all properties able to be transitioned?
No
How do block level elements affect the document flow?
by always beginning on a new line and take up full space of line
How do inline elements affect the document flow?
can start anywhere in a line
What are the default width and height of a block level element?
100% for width and height same as element or auto
What are the default width and height of an inline element?
auto
What accessibility considerations must be considered when choosing HTML elements?
good SEO, easier to develop with, for screen readers
What is the initial display property of <div>?</div>
block
What is the difference between display:none and visibility: hidden?
display:none is hidden and takes no space while visibility:hidden is not visible but gets it’s original space
What is the difference between the block, inline block, and inline display?
inline-causes a block level element to act like an inline element
block-causes an inline element to act like a block level element
inline block-causes a block level element to flow like an inline element while retaining other features of a block level element
Why are CSS resets helpful to cross browser compatibilty?
allow the developer to create changes within a global HTML sequence and to ensure universal uniformity
Why is it important to be mindful of what you reset with your CSS resets?
for others you are potentially working to not have an issue
What is an argument against using CSS resets?
a lot of the styles are eventually overridden by the main stylesheet anyways
