Get Started. It's Free
or sign up with your email address
Rocket clouds
CSS by Mind Map: CSS

1. study group

1.1. interest

1.2. logistics

2. organization strategies

2.1. bem

2.2. oocss

2.3. smacss

2.4. suit

2.5. solid

2.6. csstyle

2.7. rscss

2.8. mvcss

2.9. amcss

2.10. amcss

2.11. functional css (https://marcelosomers.com/writing/rationalizing-functional-css/)

3. browser compatibility

3.1. caniuse

4. inspiration and thought exercises

4.1. http://www.csszengarden.com/

4.2. http://codepen.io/ryandunn/pen/eZgmMY

4.3. http://tympanus.net/codrops/

5. thought leaders

5.1. eric meyer (meyerweb.com)

5.2. chris coyier (css-tricks.com)

5.3. rachel andrew (css grids, rachelandrew.co.uk)

5.4. lea verou (lea.verou.me)

5.5. rachel nabors (animation, rachelnabors.com)

5.6. sara soueidan (vectors, sarasoueidan.com)

5.7. jeffrey zeldman (zeldman.com)

5.8. ethan marcotte (responsive, ethanmarcotte.com)

5.9. philip walton (philipwalton.com)

5.10. ire aderinokun (bitsofco.de)

6. research/education/reference

6.1. newsletters

6.1.1. http://css-weekly.com/

6.1.2. http://heydesigner.com/

6.2. websites

6.2.1. http://tympanus.net/codrops/css_reference

6.2.2. https://developer.mozilla.org/en-US/docs/Web/CSS/Reference

6.3. conferences

7. scope

8. generating

8.1. post css

8.2. precompilers

8.2.1. scss (sassy css)

8.2.1.1. mixins

8.2.1.2. @extend

9. applying

9.1. link

9.2. inline

9.2.1. critical/above-the-fold

9.3. shadow dom

10. language/syntax

10.1. spec

10.1.1. css vs css2 vs css3 (2.1+) vs modules (there is no css4)

10.1.2. http://julian.io/tomorrows-css-syntax-with-cssnext/

10.2. scope

10.3. !important

10.3.1. or !please via https://github.com/idiot/Spiffing

10.4. inherit

10.5. currentColor

10.6. units

10.6.1. rem vs em

10.7. rules, properties, selectors

10.8. state selectors

10.8.1. e.g., :hover

10.9. pseudo elements

10.10. pseudo selectors

10.10.1. :nth-*, :not

10.11. descendant, sibling

10.11.1. >, +, ~

10.12. attribute selectors

10.12.1. e.g., [name*="foo"]

10.13. color

10.13.1. hex

10.13.2. abbreviated hex

10.13.3. named

10.13.4. rgba

10.13.5. hsl, hsla

10.14. gradients

11. design

11.1. interactive

11.1.1. radio or checkbox as state

11.1.1.1. http://lea.verou.me/2011/06/pure-css-tic-tac-toe/

11.1.1.2. http://codepen.io/elad2412/pen/hBaqo

11.1.2. http://victordarras.fr/cssgame/

11.2. visual

11.2.1. transitions and animations

11.2.1.1. transitions

11.2.1.2. animations (keyframes)

11.2.2. typography

11.2.2.1. vertical rhythm

11.2.2.2. kerning

11.2.2.3. ligatures

11.2.2.4. swashes

11.2.2.5. small caps

11.2.3. color

11.2.3.1. meaning, symbolism

11.2.3.2. contrast, color-blindness

11.2.4. positioning

11.2.4.1. layout/grid

11.2.4.1.1. grid systems

11.2.4.1.2. tabular

11.2.4.1.3. holy grail

11.2.4.1.4. flexbox

11.2.4.1.5. css grid spec

11.2.4.1.6. responsive

11.2.4.2. snap points

11.2.4.3. sticky position

12. specificity rules

13. tricky concepts

13.1. document flow

13.2. box-sizing

13.3. position

14. frameworks and resets

14.1. frameworks

14.1.1. bootstrap

14.1.2. pure

14.1.3. zurb/foundation

14.1.4. semantic-ui

14.1.5. materializecss

14.1.6. scooter

14.2. resets

14.2.1. https://necolas.github.io/normalize.css/

14.2.2. http://html5doctor.com/html-5-reset-stylesheet/

14.2.3. http://meyerweb.com/eric/tools/css/reset/

15. global/local CSS

15.1. https://medium.com/seek-ui-engineering/the-end-of-global-css-90d2a4a06284

16. specifying

16.1. houdini (task force)

17. lint and code styles

17.1. CSScomb

17.2. CSS Lint

17.3. stylelint