Δημιουργήστε ερωτήματα σχετικά με την ποσότητα του CSS με το QQ Builder
Λίγοι προγραμματιστές γνωρίζουν ή χρησιμοποιούν CSS ζητήματα ποσότητα στους ιστοτόπους τους. Είναι αρκετά περίπλοκο χαρακτηριστικό αλλά και χρήσιμο όταν εσύ έχουν διάφορα αντικείμενα σε ένα δοχείο.
Μπορεί να γίνει ερώτημα σχετικά με την ποσότητα αλλαγή / ενημέρωση ιδιότητες CSS βασισμένο στο προκαθορισμένα όρια για τα παιδιά. Για παράδειγμα, αν έχετε περισσότερα από τρία στοιχεία σε μια λίστα μπορείτε να κάνετε τη γραμματοσειρά μικρότερη για να εξοικονομήσετε χώρο. Ένα άλλο παράδειγμα είναι ενημέρωση του πλάτους ενός συνδέσμου βασισμένο στο αριθμός συνδέσμων σε ένα μενού πλοήγησης.
Καθήκοντα όπως αυτά μπορούν να περιπλέκεται γρήγορα αλλά χάρη στο Ποσότητα Queries Builder δεν χρειάζεται να απομνημονεύσετε τυχόν σύντομη σύνταξη.
Αυτή η εφαρμογή ιστού δημιουργεί όλο τον κώδικα για εσάς για εξοικονόμηση χρόνου. Πρέπει να το κάνετε επιλέξτε από τρία αναπτυσσόμενα μενού που προσαρμόζουν την ερώτησή σας ποσότητα. Λειτουργούν έτσι:
- Εκλέκτορας - ποια στοιχεία παιδιού πρέπει να υπολογίζονται
- Τύπος ερωτήματος - Διάλεξε μεταξύ “στο μέγιστο”, “τουλάχιστον”, ή ένα σύνθετο του “στο μέγιστο” & & “τουλάχιστον”
- Ποσό - συνολικός αριθμός αντικειμένων για φιλτράρισμα
Αυτό φαίνεται να προκαλεί σύγχυση στον κώδικα, αλλά είναι μια πολύ απλή ιδέα. Τα ερωτήματα ποσοτήτων σας επιτρέπουν να εφαρμόζετε ιδιότητες CSS με βάση το συνολικό αριθμό παιδικών στοιχείων.
Ωστε να μπορείτε να προσθέστε ορισμένα στυλ CSS όταν υπάρχει, ας πούμε, τουλάχιστον 4 στοιχεία παιδιού (4 ή περισσότερα). Ή, θα μπορούσατε προσθέστε στυλ μόνο όταν υπάρχει στο μέγιστο 4 στοιχεία παιδιού (0-4 παιδιά).
Ο συνδυασμός επιλογής σας επιτρέπει να ορίσετε ακριβώς πόσα ελάχιστα & μέγιστα παιδιά είναι απαραίτητες για την εμφάνιση ορισμένων ιδιοτήτων CSS.
Στο παράδειγμα στο παραπάνω στιγμιότυπο οθόνης, έχω ρυθμίσει το σύνολο “στο μέγιστο” αντικειμένων σε 2. Αυτό σημαίνει ότι όταν έχω 0, 1, ή 2 παιδιά τα μπλοκ είναι κόκκινα. Αν προσθέσω ένα ακόμα για να πάρουν 3 παιδιά τότε όλα τα μπλοκ μπλε.
Αν δεν έχετε ιδέα τι συμβαίνει μπορείτε κάντε κλικ στο μικρό πλαίσιο πληροφοριών στην πλευρική γραμμή. Θα φέρει ένα παράθυρο με δεδομένα και σύνταξη εξηγώντας τη δυνατότητα ερώτησης ποσοτήτων.
Αυτό είναι ένα πολύ βολικό εργαλείο για τόσο αρχάριους όσο και έμπειρους προγραμματιστές. Θα το κάνει εξοικονομήστε πολύ χρόνο μακροπρόθεσμα και θα σας βοηθήσει δημιουργήστε πιο δυναμικούς ιστότοπους.
Για να ξεκινήσετε, επισκεφθείτε τον ιστότοπο του κατασκευαστή QQ και τον ιστότοπο ξεκινήστε να προσαρμόζετε τις λειτουργίες σας. Μπορείς παιχνίδι με τα αποτελέσματα και ελέγξτε τη ζωντανή προεπισκόπηση στο δεξιό παράθυρο για να μάθετε πώς οι αλλαγές σας επηρεάζουν τα στοιχεία του παιδιού.
Αυτό το έργο είναι επίσης διαθέσιμη στο GitHub έτσι είστε ελεύθεροι να ελέγξτε τον πηγαίο κώδικα ή ακόμη και κατεβάστε ένα αντίγραφο τοπικά. Και αν σας αρέσει αυτή η εφαρμογή ή έχετε οποιεσδήποτε ερωτήσεις / προτάσεις για τον δημιουργό Drew Minns μπορείτε να τον πυροβολήσετε ένα γρήγορο tweet @drewisthe.
