Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Object-Oriented CSS

Avatar for Rachel Ober Rachel Ober
April 12, 2013
Programming
1
43

Object-Oriented CSS

Avatar for Rachel Ober

Rachel Ober

April 12, 2013
Tweet

More Decks by Rachel Ober

See All by Rachel Ober
So, You Want to Organize a Conference
Avatar for Rachel Ober rachelober
0
52
Front End Workshop 2015
Avatar for Rachel Ober rachelober
0
67
Front End Overview for Interns 2015
Avatar for Rachel Ober rachelober
1
47
IE Classes
Avatar for Rachel Ober rachelober
0
49
Front End Overview (2014)
Avatar for Rachel Ober rachelober
0
46
Team Communication Through Code
Avatar for Rachel Ober rachelober
0
74
Responsive Emails
Avatar for Rachel Ober rachelober
0
41
What I Learned About SVG
Avatar for Rachel Ober rachelober
0
50
Paperless Post Sass
Avatar for Rachel Ober rachelober
1
89

Other Decks in Programming

See All in Programming
AkarengaLT vol.38
Avatar for hashimoto-kei hashimoto_kei
1
130
What's new in Spring Modulith?
Avatar for Oliver Drotbohm olivergierke
1
170
Leading Effective Engineering Teams in the AI Era
Avatar for Addy Osmani addyosmani
7
650
SwiftDataを使って10万件のデータを読み書きする
Avatar for akidon0000 akidon0000
0
240
3年ぶりにコードを書いた元CTOが Claude Codeと30分でMVPを作った話
Avatar for 小島舞子 / Maiko Kojima maikokojima
0
650
Migration to Signals, Resource API, and NgRx Signal Store
Avatar for Manfred Steyer manfredsteyer
PRO
0
130
品質ワークショップをやってみた
Avatar for Nealle nealle
0
650
モテるデスク環境
Avatar for mozumasu mozumasu
3
1.3k
Cursorハンズオン実践！
Avatar for Ikko Eltociear Ashimine eltociear
2
1.2k
Things You Thought You Didn’t Need To Care About That Have a Big Impact On Your Job
Avatar for Holly Cummins hollycummins
0
260
他言語経験者が Golangci-lint を最初のコーディングメンターにした話 / How Golangci-lint Became My First Coding Mentor: A Story from a Polyglot Programmer
Avatar for uMa uma31
0
450
開発組織の戦略的な役割と 設計スキル向上の効果
Avatar for 増田 亨 masuda220
PRO
10
1.7k

Featured

See All Featured
Visualization
Avatar for Eitan Lees eitanlees
150
16k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
53k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
9.1k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
697
190k
The World Runs on Bad Software
Avatar for Brandon Keepers bkeepers
PRO
72
11k
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
379
70k
Statistics for Hackers
Avatar for Jake VanderPlas jakevdp
799
220k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
44
7.8k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
10
890
Music & Morning Musume
Avatar for Bryan Veloso bryan
46
6.9k
Designing Experiences People Love
Avatar for Jonathan Moore moore
142
24k

Transcript

  1. Object-Oriented CSS

  2. Grid

  3. None

  4. Padding & Margins

  5. app/styles/styleguide/_spacing.scss

  6. None
  7. None

  8. Does that really help us?

  9. Cascading Style Sheets (CSS) Noun A style sheet language used

    for describing the presentation semantics (the look and formatting) of a document written in a markup language.

  10. When I want to change a style, I should only

    touch the CSS, not the HTML

  11. http://ianstormtaylor.com/oocss-plus-sass-is-the-best-way-to-css/

  12. OOCSS + Sass

  13. None
  14. None
  15. None