family.scss
versionv1.0.4
Family.scss is a set of 24smart Sass mixins which will help you to manage the style of :nth-child'ified elements, in an easy and classy way.
Website : http://lukyvj.github.io/family.scss/
Installation
Regular
- Clone the project
- $ middleman( You don't use middleman ? Goto https://middlemanapp.com/)
Alternative install
- $ npm install family.scss
- $ bower install family.scss
Family.scss on npm
Usage
First of all, import the Family.scss source fileinto your project.
立即学习“前端免费学习笔记（深入）”；
Then you can use the mixins right away on your stylesheets.
Input :
ul li { background: blue; @include first(3) { background: blue; }} Output :
ul li { background: blue;}ul li:nth-child(-n + 3) { background: blue;} Why only Sass ?
It's true, I did it for Sass, but some awesome contributors extended it to :
- Stylus
Changelogs
v1.0.3
- first()mixin now uses :first-childif the given parameter is 1, closing#10
- n-between()mixin added, closing#35
- at-least(), at-most()and in-between()quantity queries mixins added, closing#24
- pair-between()is now even -between(), closing#34
- impair-between()is now odd-between(), closing#34
- Source code for the header pattern generator added in the about modal
- Version number added in the footer
- backdrop-filterremoved from the about page
