12 - CSS Flashcards
describe how HTML documents are to be rendered on screen
Cascading Style Sheets (CSS)
CSS makes use of ___ to specify which elements to apply style to
selectors
selector for id
#
selector for class
.
child element (access text)
<p id = 'main'>
<span class='text'></span>
</p>
main .text
direct child element (access text)
<div id='main'>
<span class = 'text'></span>
</div>
main > .text
combination: access .one
<div class = 'one'></div><div class = 'one two'></div>
div .one
combination: access class one two<div class = 'one two'></div>
div.one.two
multiple: access both divs
<div class = 'one'></div><div class = 'two'></div>
.one, .two
3 ways to declare CSS in HTML
inline styling
internal style sheets
external style sheets
factors in cascading (3)
importance and origin
specificity
source order
style of any element has 3 possible origins
author
user
user-agent
css provided by the web page author
author
browser settings as configured by the user
user
default style sheet of the rendering engine
user agent
css hierarchy based on origin
author > user > user agent
take precedence over non-important ones
!important
reverse the order of precedence by origin
!important
reversed style precedence by origin due to !important
important user agent > important user > important author > author > user > user agent
determined by counting the number of tags, classes, id, attributes, etc
specificity
determining factors for specificity (4)
- in-line
- contains an id
- # of classes, attributes, pseudo-classes
- # of tags and pseudo elements
can be appended to a selector to style specific parts of an element
pseudo element
5 pseudo elements
::after
::before
::first-letter
::first-line
::selection
can be appended to a selector to style a special state of an element
pseudo class
last declared style overrules the rest
source order
kicks in when no source tries to set a property
inheritance
responsive design is achieved through the use of ____
media queries
used to apply a block of css only if certain conditions are met
media queries
