Sass прави много хора щастливи
февруари 17, 2013 at 11:56 | Blog | No comment
Наскоро открих Sass, това ме прави изключително щастлив и мисля, че така ще си подобря начина, по който пиша стилове за уеб.
Имам голяма слабост към @extend. Въпреки че като цяло тази директива не е много сложна по природа: „селектор А трябва да се държи като селектор Б”, използването й може да бъде доста заплетено и подробно.
Още едно голямо предимство на наследяването на селектори е, че то премахва необходимостта в маркиращия код да се използва понякога водещото до грешки повторение на класове в наследствена йерархия.
Директивата @extend се използва за означаване на селектора, от който се наследява.
Пример за наследяване на селектори:
|
1 2 3 4 5 6 7 8 9 10 11 12 |
.rounded { border-radius: 5px; border: 1px solid #ccc; } .widget { @extend .rounded; border-color: blue; } .bright-widget { @extend .widget; border-color: #9999ff; } |
Пример за Миксини:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
@mixin clearfix { &:after { content : "\0020"; display : block; height : 0; clear : both; overflow : hidden; visibility : hidden; } *zoom: 1; } .widget { @include clearfix; } |
 |
| Всички обичат Sass |
За разлика от миксините, които използват съдържание в селектор, при @extend наследяването се прилагат селектори към други селектори. Така нашите стилове стават по-кратки, а и може да се ползват много от предимствата на миксините.
Измислянето на алгоритми за @extend и правилното им прилагане е сред най-големите преимущества на Sass.
Има няколко страхотни клипчета на разположение в Интернет.
В момента чета една прекрасна книга на за Sass – “Sass in Action” с автори Уин Нидърленд , Крис Епщайн и Нейтън Вайзънбаум (водещ разработчик и архитект на Sass).
