2_how_css_is_structured
dz / mdn / css / 0_css_first_steps / 2_how_css_is_structuredSummary
How CSS is structured
Node Tree
Nodes
| applying_css_html | |
| content | Applying CSS to HTML |
| children | stylesheet, inline_styles |
| stylesheet | |
| content | stylesheet |
| children | ext_stylesheet, internal_stylesheet |
| parents | applying_css_html |
| ext_stylesheet | |
| content | external stylesheet |
| children | tag_link |
| parents | stylesheet |
| internal_stylesheet | |
| content | internal stylesheet |
| children | tag_head, tag_style |
| parents | stylesheet |
| inline_styles | |
| content | Inline styles |
| children | style_attribute |
| parents | applying_css_html |
| remarks | avoid this approach |
| tag_link | |
| content | <link> |
| parents | mdn/html/elements, ext_stylesheet |
| tag_style | |
| content | <style> |
| parents | tag_head, internal_stylesheet, mdn/html/elements |
| tag_head | |
| content | <head> |
| children | tag_style |
| parents | internal_stylesheet, mdn/html/elements |
| style_attribute | |
| content | style attribute |
| parents | inline_styles |
| selector | |
| content | selector |
| children | specificity, cascade, css_rulesets |
| specificity | |
| content | Specificity |
| children | rules_event_of_conflict |
| parents | selector |
| cascade | |
| content | cascade |
| children | rules_event_of_conflict |
| parents | selector |
| rules_event_of_conflict | |
| content | Rules to control which is stronger in the event of conflict |
| parents | specificity, cascade |
| props_vals | |
| content | Properties and Values |
| children | vals, case_insensitive, css_declaration, props |
| props | |
| content | Properties |
| children | shorthand_properties, human_readable_identifiers (description), prop_names_no_whitespace |
| parents | props_vals |
| vals | |
| content | Values |
| children | several_vals_single_line |
| parents | props_vals |
| human_readable_identifiers | |
| content | Human Readable Identifiers, Which stylistic features to modify |
| parents | props |
| css_declaration | |
| content | CSS declaration |
| children | declaration_blocks |
| parents | props_vals |
| declaration_blocks | |
| content | Declaration Blocks |
| parents | css_declaration, css_rulesets |
| css_rulesets | |
| content | CSS rulesets |
| children | declaration_blocks |
| parents | selector |
| case_insensitive | |
| content | Case Insensitive |
| parents | props_vals |
| functions | |
| content | Functions |
| children | transform, calc |
| calc | |
| content | calc() |
| parents | functions |
| transform | |
| content | transform |
| children | rotate |
| parents | functions |
| rotate | |
| content | rotate |
| parents | transform |
| at_rules | |
| content | @rules |
| children | at_rules_name (pronunciation), instruction_perform_behave (description), at_import (example,example) |
| at_rules_name | |
| content | "at rules" |
| parents | at_rules |
| instruction_perform_behave | |
| content | Provides instruction for what CSS should perform or how it should behave |
| parents | at_rules |
| at_import | |
| content | @import |
| parents | at_rules |
| at_media | |
| content | @media |
| children | media_rules |
| media_rules | |
| content | Media Rules |
| parents | at_media |
| shorthands | |
| content | Shorthands |
| children | several_vals_single_line, shorthand_properties, omission_overrides (warning) |
| several_vals_single_line | |
| content | Several values in a single line |
| parents | vals, shorthands |
| shorthand_properties | |
| content | Shorthand Properties |
| parents | props, shorthands |
| omission_overrides | |
| content | An omission can override previously set values |
| parents | shorthands |
| comments | |
| content | comments |
| whitespace | |
| content | whitespace |
| children | prop_names_no_whitespace |
| prop_names_no_whitespace | |
| content | Property names never have any whitespace |
| parents | whitespace, props |