Automatisoi n-lapsen valitsijat Family.scss Mixinsin kanssa
nenäkkyys on paras tapa hallita nykyaikaisia CSS ja mixin-kirjastot voi säästää vielä enemmän aikaa kehitysjakson aikana.
Nämä sekoitukset toimivat automaattiset koodit tai toiminnot Sass-tiedostoihin. Jotkut sekoitukset ovat yleisempiä, kun taas toiset ovat hyvin spesifisiä, kuten Family.scss-kirjasto.
Tämä ilmainen kirjasto tarjoaa 26 sekoitusta käynnissä monimutkainen : Nnen-lapsi valitsimet tallentamatta tätä koodia.
Useimmat kehittäjät tietävät : Nnen-lapsi valitsin ja oletusarvoisesti se ei varmasti ole monimutkainen. Olet yksinkertaisesti siirtää numerovalitsimen, esimerkiksi : Nnen-lapsi (2) jossa kuuluvan tyylin säännöt koskevat vanhemman elementin jokaista toista lasta.
Tämä voi kuitenkin saada paljon monimutkaisempaa, kun haluat valita dynaamisia elementtejä (esim. ensimmäinen ja viimeinen) tai kun haluat valita a pieni kourallinen elementtejä (esim. kolme ensimmäistä lasta).
Siellä Family.scss voi auttaa. Se on hyvin pieni kirjasto, ja se sisältää 26 ratkaisua lastenvalitsimille vaihtelevat perusasetuksesta superkompleksiin. Jokaisella sekoituksella on kotisivulla demo, jota voit selata ja suodattaa tarpeen mukaan.
Tässä muutamia mielenkiintoisia esimerkkejä näyttää, mitä tämä kirjasto voi tehdä:
jälkeen ensimmäinen (5)- valitse kaikki elementit 5 ensimmäisen lapsen jälkeenfrom-pää (3)- valitse kolmas - viimeinen lapsielementtikaikki-vaan (3)- valitse kaikki lapset paitsi kolmastasaisesti (3, 12)- valitse kaikki jopa lapset 3. ja 12. elementin välillä
Voit selata useita kymmeniä ja heillä on demoja, joiden avulla voit visualisoida, miten he toimivat.
Muutama kehittynyt sekoitus luottaa määrän kyselyihin jotka valitsevat elementtejä “vähintään” tai “enintään” kiinnitetty tiettyyn alueeseen. Voit esimerkiksi valita kaikki lapset vanhemmille elementeille, joissa on vähintään 5 lasta (tai enemmän).
Nämä ajatukset voivat olla hämmentäviä luettaessa niitä, mutta live-demot todella tehdä kaikki kristallinkirkas.
Voit kaivaa sisään ladata kopion tämän yhdistelmäkirjaston GitHub-reposta ja kaikista näistä demoista. Ja voit jakaa ajatuksiasi tai kysymyksiäsi projektin luojan kanssa Twitterissä @LukyVJ.
