Ustvarite poizvedbe o količini CSS s QQ Builderjem
Nekaj razvijalcev pozna ali uporablja Število poizvedb CSS na svojih spletnih straneh. To je precej zapletena funkcija, vendar tudi uporabna, ko ste vsebujejo različne predmete v posodi.
Količinska poizvedba lahko spremenite / posodobite lastnosti CSS temelji na vnaprej določene omejitve za podrejene elemente. Na primer, če imate več kot tri postavke na seznamu lahko naredite pisavo manjšo, da prihranite prostor. Drug primer je posodabljanje širine povezave temelji na število povezav v navigacijskem meniju.
Naloge, kot so te hitro zapletejo ampak zahvaljujoč Graditelj poizvedb količine ni vam treba zapomniti zmede v sintaksi.
Ta spletna aplikacija ustvari vso kodo za vas da prihranite čas. Moraš izberite med tremi spustnimi meniji ki prilagajajo količinsko poizvedbo. Delujejo tako:
- Izbirnik - kateri od otroških elementov je treba prešteti
- Vrsta poizvedbe - izbirate med “največ”, “vsaj”, ali kombinacija “največ” & “vsaj”
- Znesek - skupno število elementov za filtriranje
To se zdi zmedeno v kodi, vendar je to zelo preprost koncept. Poizvedbe o količinah omogočajo uporabo lastnosti CSS temelji na skupnem številu podrejenih elementov.
Torej lahko dodajte določene stile CSS ko je tam, recimo, vsaj 4 otroški elementi (4 ali več). Ali pa bi lahko dodaj sloge samo, ko tam je največ 4 otroški elementi (0-4 otroci).
Kombinirani izbirnik vam omogoča, da določite natančno koliko najmanjših in največjih otrok so potrebne za prikaz nekaterih lastnosti CSS.
V primeru na zgornji sliki zaslona sem nastavil skupaj “največ” predmetov To pomeni, da so bloki rdeči, če imam 0, 1 ali 2 otroka. Če dodam še enega, da dobim 3 otroke, potem vsi bloki postanejo modri.
Če ne veste, kaj se dogaja, lahko kliknite majhno informacijsko polje v stranski vrstici. To bo prineslo modalno okno z dejstvi in skladnjo razlaga funkcije količinske poizvedbe.
To je zelo priročno orodje za tako začetniki kot izkušeni razvijalci. To bo prihranite veliko časa na dolgi rok in to vam bo pomagalo ustvarite bolj dinamične spletne strani.
Če želite začeti, obiščite spletno mesto graditelja QQ in začnite prilagajati svoje funkcije. Ti lahko z rezultati in preverite predogled v živo v desnem podoknu, če želite izvedeti, kako spremembe vplivajo na podrejene elemente.
Ta projekt je tudi GitHub tako si lahko preverite izvorno kodo ali celo lokalno prenesite kopijo. In če imate radi to aplikacijo ali imate kakršna koli vprašanja / predloge za ustvarjalca Drew Minns, mu lahko hitro ustrelite cvrkutati @drewisthe.