mdn/css/1_css_building_blocks/16_organizing_your_css

16_organizing_your_css

dz / mdn / css / 1_css_building_blocks / 16_organizing_your_css

Summary

Organizing Your CSS

Node Tree

Nodes

tidy_CSS
content Tidy CSS
children avoid_overspecific_selectors, break_into_smaller, coding_style_guide, comments, consistent, readability

consistent
content consistent
parents tidy_CSS

coding_style_guide
content Coding Style Guide
parents tidy_CSS

comments
content comments
children header_comment_convention
parents tidy_CSS

readability
content Readability
children single_vs_multi_line_rules
parents tidy_CSS

single_vs_multi_line_rules
content Single line rules vs multi-line rules (pref)
parents readability

logical_sections
content Logical Sections
children general_styles, header_comment_convention, sitewide, specific_things, utilities

header_comment_convention
content Header comment coding convention: || Foo
parents comments, logical_sections

general_styles
content General Styles
parents logical_sections

utilities
content Utilities
parents logical_sections

sitewide
content Sitewide
parents logical_sections

specific_things
content Specific Things
parents logical_sections

avoid_overspecific_selectors
content Avoid overly specific selectors
parents tidy_CSS

break_into_smaller
content Break large stylesheets into multiple smaller ones
parents tidy_CSS

other_helpful_tools
content Other Helpful Tools
children BEM, OOCSS, build_systems_CSS

OOCSS
content Object-oriented CSS (OOCSS)
children media_object_pattern
parents other_helpful_tools

media_object_pattern
content The Media Object pattern
parents OOCSS

BEM
content BEM: block element modifier
parents other_helpful_tools

build_systems_CSS
content Build systems for CSS
children SASS, pre_post_processors
parents other_helpful_tools

pre_post_processors
content Pre/post processors
children CSS_nano
parents build_systems_CSS

SASS
content SASS
children defining_variables, partials
parents build_systems_CSS

defining_variables
content Defining Variables
children less_important_with_custom_props
parents SASS

less_important_with_custom_props
content Custom properties in CSS make this less important
parents defining_variables

partials
content Partials
parents SASS

CSS_nano
content post-processor for shrinking files
parents pre_post_processors