Generujte množstvo otázok CSS s nástrojom QQ Builder
Málokto vývojári to vedia alebo používajú Počet otázok týkajúcich sa množstva CSS na svojich internetových stránkach. Je to pomerne zložitá funkcia, ale aj užitočná mať rôzne položky v kontajneri.
Môže sa stať dotaz na množstvo zmeniť / aktualizovať vlastnosti CSS založené na vopred definované limity pre detské elementy. Napríklad, ak máte viac ako tri položky v zozname by ste mohli písmo zmenšiť, aby ste ušetrili miestnosť. Ďalším príkladom je aktualizácia šírky odkazu založený na počet odkazov v navigačnom menu.
Takéto úlohy môžu rýchlo komplikuje ale vďaka Nástroj Quest Builder nemusíte pamätať žiadnu matúcu syntax.
Táto webová aplikácia generuje celý kód pre vás ušetriť čas. Musíte vyberte si z troch rozbaľovacích ponúk ktoré prispôsobia množstvo dotazu. Pracujú takto:
- selektor - ktoré detský element (y) by sa mali počítať
- Typ dopytu - vyberte medzi “najviac”, “najmenej”, alebo kombinácia “najviac” & “najmenej”
- čiastka - celkový počet položiek na filtrovanie
To sa zdá byť mätúce v kóde, ale je to naozaj jednoduchý koncept. Množstvové dopyty vám umožňujú použiť vlastnosti CSS na základe celkového počtu detských prvkov.
Takže môžeš pridať určité štýly CSS keď je, povedzme, najmenej 4 detské prvky (4 a viac). Alebo by ste mohli pridať štýly iba vtedy je tu najviac 4 detské elementy (0-4 deti).
Kombinovaný volič vám umožňuje definovať presne koľko minimálnych a maximálnych detí sú potrebné na zobrazenie určitých vlastností CSS.
V príklade na snímke obrazovky vyššie som nastavil totálnej “najviac” položky na 2. To znamená, že keď mám 0, 1 alebo 2 deti, bloky sú červené. Ak pridám ešte jednu, aby som získal 3 deti, všetky bloky sa zmenia na modrú.
Ak nemáte tušenie, čo sa deje, môžete kliknite na malé informačné pole v bočnom paneli. To prinesie a modálne okno s faktami a syntaxami vysvetlenie funkcie dotazového množstva.
Je to veľmi užitočný nástroj ako začiatočníkov, tak skúsených vývojárov. Bude to ušetrite veľa času z dlhodobého hľadiska vám pomôže vytvoriť dynamickejšie webové stránky.
Ak chcete začať, navštívte webovú lokalitu staviteľa QQ a začnite prispôsobovať svoje funkcie. Môžeš hračka s výsledkami a skontrolujte živý náhľad v pravom okne sa dozviete, ako vaše zmeny ovplyvňujú podradené prvky.
Tento projekt je tiež k dispozícii na GitHub takže máte slobodu skontrolujte zdrojový kód alebo dokonca stiahnite kópiu lokálne. A ak máte radi túto aplikáciu alebo máte akékoľvek otázky / návrhy pre tvorcu Drewa Minnsa, môžete ho strieľať rýchlo tweet @drewisthe.
