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
41

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
51
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
48
Front End Overview (2014)
Avatar for Rachel Ober rachelober
0
46
Team Communication Through Code
Avatar for Rachel Ober rachelober
0
73
Responsive Emails
Avatar for Rachel Ober rachelober
0
41
What I Learned About SVG
Avatar for Rachel Ober rachelober
0
49
Paperless Post Sass
Avatar for Rachel Ober rachelober
1
89

Other Decks in Programming

See All in Programming
MCP連携で加速するAI駆動開発/mcp integration accelerates ai-driven-development
Avatar for BPStudy bpstudy
0
290
kiroでゲームを作ってみた
Avatar for 入井 啓太 iriikeita
0
150
STUNMESH-go: Wireguard NAT穿隧工具的源起與介紹
Avatar for Date Huang tjjh89017
0
320
Portapad紹介プレゼンテーション
Avatar for KAKERU gotoumakakeru
1
100
GitHub Copilotの全体像と活用のヒント AI駆動開発の最初の一歩
Avatar for 74th(Atsushi Morimoto) 74th
7
2.4k
CEDEC 2025 『ゲームにおけるリアルタイム通信への QUIC導入事例の紹介』
Avatar for SEGADevTech segadevtech
3
820
リッチエディターを安全に開発・運用するために
Avatar for una unachang113
1
370
No Install CMS戦略 〜 5年先を見据えたフロントエンド開発を考える / no_install_cms
Avatar for Masahiko Sakakibara rdlabo
0
480
実践 Dev Containers × Claude Code
Avatar for Yuto Akiba touyu
1
170
GUI操作LLMの最新動向: UI-TARSと関連論文紹介
Avatar for Kazuki Fujikawa kfujikawa
0
770
実践！App Intents対応
Avatar for 野瀬田　裕樹 yuukiw00w
1
230
Flutter로 Gemini와 MCP를 활용한 Agentic App 만들기 - 박제창 2025 I/O Extended Seoul
Avatar for JaiChangPark itsmedreamwalker
0
130

Featured

See All Featured
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
77
5.9k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
1
540
BBQ
Avatar for Matthew Crist matthewcrist
89
9.8k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
246
12k
Code Review Best Practice
Avatar for Trisha Gee trishagee
69
19k
Faster Mobile Websites
Avatar for Dean Hume deanohume
308
31k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
45
7.6k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
367
19k
StorybookのUI Testing Handbookを読んだ
Avatar for Shingo Yamazaki zakiyama
30
6k
Intergalactic Javascript Robots from Outer Space
Avatar for Vicent Martí tanoku
272
27k
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
23
3.6k

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