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

Object-Oriented CSS

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Rachel Ober Rachel Ober
April 12, 2013
Programming
57
1

Object-Oriented CSS

Avatar for Rachel Ober

Rachel Ober

April 12, 2013

More Decks by Rachel Ober

See All by Rachel Ober
So, You Want to Organize a Conference
Avatar for Rachel Ober rachelober
0
68
Front End Workshop 2015
Avatar for Rachel Ober rachelober
0
88
Front End Overview for Interns 2015
Avatar for Rachel Ober rachelober
1
64
IE Classes
Avatar for Rachel Ober rachelober
0
85
Front End Overview (2014)
Avatar for Rachel Ober rachelober
0
86
Team Communication Through Code
Avatar for Rachel Ober rachelober
0
90
Responsive Emails
Avatar for Rachel Ober rachelober
0
58
What I Learned About SVG
Avatar for Rachel Ober rachelober
0
82
Paperless Post Sass
Avatar for Rachel Ober rachelober
1
110

Other Decks in Programming

See All in Programming
「正の参照」と 「負の導出」で組む ハーネスエンジニアリング
Avatar for Masahiro Watanabe cottpan
1
140
分散システム、なんですぐ死んでしまうん？耐障害性を高めたいあなたのためのレジリエンスパターン入門
Avatar for Mitsuhiro Shibuya mshibuya
7
6.4k
気圧・高度・GPSを記録&可視化するアプリ「Koudo」を作った話
Avatar for Hajime Kato hjmkth
1
360
LaravelLive Japan の裏方のすべて — 第188回 PHP勉強会＠東京 (2026-06-24)
Avatar for Suguru Oki / スー suguruooki
2
150
なぜ関数型プログラミングで「型」と「証明」が語られるのか #fp_matsuri
Avatar for Takuma Kajikawa kajitack
3
960
5分で問診！Composer セキュリティ健康診断
Avatar for コドモン開発チーム codmoninc
0
340
AIを活用したE2Eテスト実装効率化のあゆみ / ebisu-mobile-14-kotetu
Avatar for kotetu (kotetuco) kotetuco
0
170
アルゴリズムは何を圧縮しているのか ─ Haskell から育った「圧縮代数」というメンタルモデル
Avatar for Naoya Ito naoya
16
3.5k
LLMによるContent Moderationの本番運用の裏側と品質担保への挑戦
Avatar for suikabar suikabar
3
860
AI がコードを書く時代における新卒エンジニアの仕事風景 (2026) / New Graduate Engineers in the Era of AI Coding (2026)
Avatar for sushichan044 sushichan044
0
220
Terraform標準の組織で AWS CDKをどう使うか
Avatar for mu7889yoon / Yuta Nakamura mu7889yoon
0
290
壊れたパーサから始める関数型設計と構成的なパーサ #fp_matsuri
Avatar for ライガー raiga0310
2
320

Featured

See All Featured
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
10
1.3k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
45
9.1k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
10k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
28
3.6k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
1.2k
KATA
Avatar for Megan Lloyd mclloyd
PRO
35
15k
Crafting Experiences
Avatar for Bethany Jepchumba bethany
1
220
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
47
8.2k
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
Avatar for Ryan Jones ryanjones
0
180
Jess Joyce - The Pitfalls of Following Frameworks
Avatar for Tech SEO Connect techseoconnect
PRO
1
190
From π to Pie charts
Avatar for Rasagy Sharma rasagy
0
240
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
Avatar for konakalab konakalab
0
490

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