It's pretty. Sass drops all the curly brackets and semi-colons, and just uses white space to figure out which property-value declarations go with which selectors. This makes for a very clean looking syntax. But it's hardly the only reason Sass is neat.
It's DRY. As in Don't Repeat Yourself. For one, selectors may be nested within one another, avoiding the need to repeat selectors for more specific cases. If you want to refer to an li with a "my_list" class within a div, it's as simple as this:
body
background-color: white
div
display: block
li.my_list
margin-left: 10px
Just throw in any other declarations below the selector you want them to apply to, and at the proper indentation. In RubyMine, groups of selectors are even collapsible, so you can keep irrelevant ones out of view.
For two, it lets you use variables, which look like "!variable". This means you don't have to go around changing common values in multiple places, but it gets better - you can perform arithmetic operations on variables. You can set up the width of a div to be automatically adjusted if you change your margin variables, for example. This is really handy for value tweaking when you're fine tuning your styling.
Mixins. Are neat. Define a mixin with "=my_mixin" and use it with "+my_mixin". Use it all over the place. You can use it way more than once, but you secretly only have to write it once (shhh.) But it gets awesomer. Mixins can take variables, as in "=my_mixin(!var)". You can use mixins across multiple pages that share similarly styled elements, saving yourself a lot of work.
Get Sassed. I swear you won't regret it.
No comments:
Post a Comment