it.hideout-lastation.com
Paradiso Per Designer E Sviluppatori


Automazione: selettori nth-child con Family.scss Mixins

Sass è il modo migliore per gestire i moderni CSS e le librerie di mixin possono risparmiare ancora più tempo durante il ciclo di sviluppo.

Questi mixin funzionano come codici o funzioni automatici che chiami nei tuoi file Sass principali. Alcuni mix sono più generali mentre altri sono molto specifici come la libreria Family.scss .

Questa libreria gratuita offre 26 mix per eseguire complessi :nth-child selettori :nth-child senza memorizzare tutto quel codice.

La maggior parte degli sviluppatori conosce il selettore :nth-child e, per impostazione predefinita, non è certamente complicato. Basta passare un selettore numerico, ad esempio :nth-child(2) dove le regole di stile dell'appartenenza si applicano a ogni secondo figlio dell'elemento genitore.

Tuttavia, questo può diventare molto più complesso quando si desidera selezionare elementi dinamici (come primo e ultimo) o quando si desidera selezionare una piccola manciata di elementi (come i primi tre figli).

Questo è dove Family.scss può aiutare. È una libreria molto piccola e contiene 26 soluzioni per i selettori di bambini che vanno dal semplice al super complesso . Ogni mixin ha una demo sulla home page, che puoi sfogliare e filtrare secondo necessità.

Ecco alcuni esempi interessanti per mostrare cosa può fare questa libreria:

  • after-first(5) : seleziona tutti gli elementi dopo i primi 5 figli
  • from-end(3) : seleziona il terzo elemento figlio ultimo
  • all-but(3) - seleziona tutti i bambini tranne il terzo
  • even-between(3, 12) - seleziona tutti i bambini pari tra il 3 ° e il 12 ° elemento

Ci sono dozzine in più che puoi sfogliare e ognuno di loro ha delle demo per aiutarti a visualizzare come funzionano.

Alcuni mixin avanzati si basano su query quantitative che selezionano elementi che sono "almeno" o "al massimo" fissati a un determinato intervallo. Ad esempio, puoi selezionare tutti i bambini per gli elementi parent con almeno 5 figli (o più).

Queste idee possono essere fonte di confusione quando si legge su di esse, ma le demo live rendono tutto molto chiaro.

Per approfondire, puoi scaricare una copia di questa libreria mixin dal repository GitHub, insieme a tutte queste demo. E puoi condividere i tuoi pensieri o domande con il creatore del progetto su Twitter @LukyVJ.

Come gestire blog che INSPIRE

Come gestire blog che INSPIRE

Quando si parla di blog, i lettori sono la base di clienti del blogger, perché la sua stessa sopravvivenza dipende da un pubblico stabile. A meno che il tuo blog non serva solo da diario personale, dovresti mirare a ispirare gli altri con i tuoi scritti . Rimarrai sorpreso dal modo in cui le tue parole possono sollevare gli altri, o dare loro una grande ispirazione o aiuto in certe aree di cui hanno bisogno.

(Consigli tecnici e di design)

10 dispositivi Smart Home per la domotica

10 dispositivi Smart Home per la domotica

Hai mai pensato di trasformare la tua casa in una casa intelligente? Non ti piacerebbe essere in grado di spegnere le luci che hai lasciato anche dopo che sei arrivato in ufficio? O accendi l'aria condizionata prima di tornare a casa dal lavoro? I dispositivi Smart Home ti consentono inoltre di monitorare la sicurezza della tua casa, di aprire le porte agli amici per un accesso temporaneo (anche se non sei a casa per riceverli) e persino di trasformare le tue normali apparecchiature in "più intelligente".

(Consigli tecnici e di design)