Roll Your Own CSS Framework
-
Upload
mike-aparicio -
Category
Technology
-
view
1.169 -
download
4
description
Transcript of Roll Your Own CSS Framework
DESIGNERS?
DEVELOPERS?
FREE FOOD?
Has this ever happened to you?
font-family?
border-radius?
font-size?
line-height?
margin?linear-gradient?
text-shadow?
box-shadow?
width?
height?
I’m out!
CSS FRAMEWORKSTwitter Bootstrap
(http://twitter.github.io/bootstrap/)Zurb Foundation
(http://foundation.zurb.com/)Gumby Framework
(http://gumbyframework.com/)
Inuit(http://inuitcss.com/)
Yaml(http://www.yaml.de/)
Kube(http://imperavi.com/kube/)
Groundworks(http://groundwork.sidereel.com/)
Skeleton(http://www.getskeleton.com/)
Workless(http://workless.ikreativ.com/)
... and many more
http://usablica.github.io/front-end-frameworks/compare.html
CSS PREPROCESSORS
• SASS (http://sass-lang.com/)
• LESS (http://lesscss.org/)
• Stylus (http://learnboost.github.io/stylus/)
CSS PREPROCESSORS
• Variables
• Operations
• Mixins
• Nesting
CodeKitMac - $25
(http://incident57.com/codekit/)
PreprosWin - Open Source
(http://alphapixels.com/prepros/)
KoalaMac/Win/Linux - Open Source
(http://koala-app.com/)
ScoutMac/Win - Open Source
(http://mhs.github.io/scout-app/)
http://necolas.github.io/normalize.css/
http://www.netmagazine.com/tutorials/build-responsive-site-week-designing-responsively-part-1
http://www.fontsquirrel.com/tools/webfont-generator
NOT US
US