Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Sass - CSS wie es eigentlich sein sollte
Search
qutic
November 24, 2012
Technology
0
70
Sass - CSS wie es eigentlich sein sollte
qutic
November 24, 2012
Tweet
Share
More Decks by qutic
See All by qutic
Server-Monitoring mit Zabbix
qutic
1
380
kivitendo REST API
qutic
0
160
Private Cloud mit SmartOS und Project FiFo
qutic
0
67
Open Source - eine Alternative zu FileMaker?
qutic
0
690
Server-Orchestration mit Rundeck
qutic
0
99
Erstellung hochverfügbarer Dienste mit Consul
qutic
0
62
KVM mit OmniOS
qutic
0
96
Radiant CMS
qutic
1
390
Capistrano
qutic
1
140
Other Decks in Technology
See All in Technology
Tokyo_reInforce_2025_recap_iam_access_analyzer
hiashisan
0
180
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
soudai
PRO
47
19k
ビズリーチが挑む メトリクスを活用した技術的負債の解消 / dev-productivity-con2025
visional_engineering_and_design
3
7.5k
無意味な開発生産性の議論から抜け出すための予兆検知とお金とAI
i35_267
4
13k
Operating Operator
shhnjk
1
580
LangSmith×Webhook連携で実現するプロンプトドリブンCI/CD
sergicalsix
1
230
American airlines ®️ USA Contact Numbers: Complete 2025 Support Guide
airhelpsupport
0
380
FOSS4G 2025 KANSAI QGISで点群データをいろいろしてみた
kou_kita
0
400
2025 AWS Jr. Championが振り返るAWS Summit
kazukiadachi
0
110
生まれ変わった AWS Security Hub (Preview) を紹介 #reInforce_osaka / reInforce New Security Hub
masahirokawahara
0
470
SEQUENCE object comparison - db tech showcase 2025 LT2
nori_shinoda
0
130
Delegating the chores of authenticating users to Keycloak
ahus1
0
140
Featured
See All Featured
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.4k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
138
34k
The Cult of Friendly URLs
andyhume
79
6.5k
Mobile First: as difficult as doing things right
swwweet
223
9.7k
Agile that works and the tools we love
rasmusluckow
329
21k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.5k
What's in a price? How to price your products and services
michaelherold
246
12k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
50
5.5k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Site-Speed That Sticks
csswizardry
10
690
Fireside Chat
paigeccino
37
3.5k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Transcript
© 2012
[email protected]
Sass CSS wie es eigentlich sein sollte
Was ist Sass? ‣ Sass - Syntactically Awesome Stylesheets ‣
Sass ist ein CSS Präprozessor, der Sass zu CSS ‚kompiliert‘ ‣ Folgt dem DRY Prinzip von Ruby On Rails - Don't repeat yourself ‣ Bestandteil der Rails 3 Asset Pipeline ‣ Fazit: Sass ist CSS wie es eigentlich sein sollte
Sass-Features ★ Nesting ★ Variablen ★ Funktionen ★ Mixins ★
Vererbung
Nesting
Variablen
Funktionen
Mixins
Vererbung
Alternative Syntax Sass vs. SCSS vs. CSS
Installation gem install sass
Präprozessor ‣ Syntax-Prüfung erkennt Schreibfehler ‣ @import - alles in
einer Datei ‣ Optimiertes CSS (minify, gruppierte Selektoren) ‣ $ sass --watch input-dir:output-dir ‣ $ sass --style compressed input.sass output.css
Sass-Tools und -Libraries github.com/search?q=sass&type=Repositories css2sass sass-twitter-bootstrap tenplate
Wo ist Sass noch drin? ‣ Typo3: Sassify ‣ Wordpress:
Sass for Wordpress ‣ PHP: PHamlP ‣ Python: python-sass ‣ RadiantMagic: Sass- & SCSS-Filter build in
?
Lesenswertes ‣ http://sass-lang.com ‣ http://compass-style.org/ ‣ http://thoughtbot.com/bourbon/ ‣ http://www.webkrauts.de/2011/12/04/sass-compas/ ‣
http://www.alistapart.com/articles/getting-started-with-sass/ ‣ http://pragprog.com/book/pg_sass/pragmatic-guide-to-sass ‣ https://github.com/seaofclouds/sass-textmate-bundle ‣ https://github.com/search?q=sass&type=Repositories ‣ http://css2sass.heroku.com/ ‣ https://radiantmagic.com/