3 Φανταστικά πλαίσια CSS δεν θα θέλετε να χάσετε
Προσωπικά, προτιμώ να ξεκινήσω την κωδικοποίηση κάθε έργου με ένα μόνο πλέγμα και να χτίσω από εκεί. Είμαι επιλεκτικός έτσι και μου αρέσει να έχω τον έλεγχο σε όσο το δυνατόν περισσότερες μεταβλητές.
Υπάρχουν όμως χρόνοι, όταν αυτό δεν είναι πρακτικό. Ίσως χτίζετε μια εφαρμογή ή έναν εξαιρετικά μεγάλο και περίπλοκο ιστότοπο. Ίσως δεν έχετε χρόνο να στυλ κάθε στοιχείο από το μηδέν, και δεν χρειάζεται να. Αυτό είναι που θέλετε ένα ολοκληρωμένο πλαίσιο, με έξτρα.
Λοιπόν, έχουν γραφτεί πολλά για τα πλαίσια "μεγάλου ονόματος" - Bootstrap, Foundation, Gumby - έτσι δεν πρόκειται να μιλήσουμε για αυτούς εδώ. Έχω παίξει wi ... εννοώ αυστηρά δοκιμάζοντας τρεις από τις λιγότερο γνωστές επιλογές. Ρίξτε μια ματιά, ένας από αυτούς μπορεί να είναι ακριβώς αυτό που χρειάζεστε.
Kube
Kube είναι σίγουρα ένα εργαλείο για τον σύγχρονο developer front-end. Μόνο σύγχρονα προγράμματα περιήγησης - και IE9 + - υποστηρίζονται. Τα προεπιλεγμένα στυλ είναι όμορφα, αλλά αρκετά ήπια ώστε να είναι προσαρμοσμένα για χρήση με σχεδόν οποιαδήποτε επωνυμία.
Είναι, εν ολίγοις, ένα ωραίο αλλά απλό και απλό πλαίσιο σχεδιασμένο με σχεδόν καθολική οπτική εμφάνιση και προοριζόμενο για βαριά προσαρμογή.
Τα γνωρίσματα
Για να περιγράψω όλα τα χαρακτηριστικά σε βάθος ή ακόμα και να τα απαριθμήσω απλά, θα μπορούσε να πάρει πολύ μεγάλο χώρο σε αυτό το άρθρο, γι 'αυτό θα σας δώσω τα κυριότερα σημεία: Το ίδιο το πλαίσιο είναι λιγότερο βασισμένο και αρθρωτό. Εάν θέλετε τα πάντα, εκτός από τα στυλ κουμπιών, για παράδειγμα, είναι πολύ απλό να "συντάξετε" τη δική σας. Απλά καταργήστε τον αντίστοιχο κανόνα @import από το kube.less και πηγαίνετε. Είναι ασφαλές να πούμε ότι υπάρχουν στυλ για σχεδόν κάθε στοιχείο HTML που μπορείτε να σκεφτείτε και τα συνήθη πρόσθετα όπως κουμπιά, βασικές γραμμές πλοήγησης, τάξεις βοηθών και ένα αρκετά στερεό σύστημα διάταξης πλέγματος.
Κατά μία έννοια, το Kube ορίζεται εν μέρει από αυτό που δεν έχει. Για παράδειγμα, δεν έχει υπερβολικό αριθμό στοιχείων UI και επιπλέον στυλ. Δεν υπάρχουν plug-ins του jQuery για τη λειτουργικότητα του UI. Και σίγουρα δεν έρχεται με την εντύπωση ότι είστε "κολλημένοι" με κάποιο από αυτά.
συμπέρασμα
Το Kube είναι μια συμπαθητική προσφορά. Οι δημιουργοί του δεν αγόραζαν τα βασικά στοιχεία, αλλά υπάρχει μια σαφής αίσθηση "μόνο ό, τι χρειάζεστε" που έρχεται με αυτό το πλαίσιο. Είναι ένα καλό μέρος για να ξεκινήσετε και έτσι ενσωματώνει τον πραγματικό σκοπό οποιουδήποτε πλαισίου. Το χρώμα μου εντυπωσίασε.
Πλαίσιο IVORY
ΕΛΕΦΑΝΤΟΔΟΝΤΟ, όπως το Kube, έχει σχεδιαστεί για να κατανοείται εύκολα και να εφαρμόζεται γρήγορα. Η τυπογραφία φαίνεται καλή, αλλά είναι αρκετά ήπια για χρήση με σχεδόν οποιοδήποτε έργο, και οι γενικές προεπιλεγμένες μορφές είναι επίσης.
Είναι ένα πλαίσιο που έχει σχεδιαστεί για να σας παρέχει αρκετά για να ξεκινήσετε και μερικά επιπλέον.
Τα γνωρίσματα
Τα χαρακτηριστικά γνωρίσματα είναι αυτά που κανονικά περιμένετε: σταθερό και ευέλικτο σύστημα πλέγματος, στυλ για τυπογραφία και όλες τις μορφές κ.ο.κ. Ωστόσο, το IVORY διαφέρει από το Kube, διότι σας παρέχονται μερικά επιπλέον στοιχεία UI: κουμπιά, κουτάκια ειδοποίησης, σελίδωση, διακόπτες εναλλαγής, περιγράμματα εργαλείων, πλοήγηση διασταύρωσης, καρτέλες και ακορντεόν.
Αυτό που θέτει αυτά τα στοιχεία UI εκτός από πολλά άλλα είναι ότι όλα αυτά εφαρμόζονται με το CSS3 και χωρίς JavaScript. Ο μόνος λόγος που συνδέεται με το jQuery UI είναι να κάνετε την εργασία επιλογής ημερομηνιών.
Μόνο δύο πράγματα που δεν μου αρέσει: μερικά από τα στυλ συστατικού UI θυμίζουν πολύ τα στυλ Bootstrap 2.0. ¶ ¶Έτσι ναι, ίσως θέλετε να αλλάξετε αυτά. Επιπλέον, το σύστημα πλέγματος απαιτεί τη χρήση μιας επιπλέον κλάσης στην τελευταία στήλη σε οποιαδήποτε σειρά. Απλώς το μισώ .
συμπέρασμα
Αυτές οι δύο μικρές επιφυλάξεις στην άκρη, το πλαίσιο IVORY είναι μια καλή επιλογή για οποιοδήποτε αριθμό έργων. Δεν είναι το πιο εύκολα προσαρμόσιμο των επιλογών, αλλά αν χρειαστεί να ξεκινήσετε με ένα καλό σύνολο προεπιλογών, και μερικά επιπλέον στοιχεία UI, δώστε το ένα στροβιλισμό.
Βάση
Βάση, με Μάθιου Χάρτμαν , παίρνει μια κάπως πιο μοντέρνα (επί του παρόντος, σε κάθε περίπτωση) προσέγγιση στο πλαίσιο του CSS. Βασισμένο στο Normalize.css , ξεκινάει με λεπτές γραμματοσειρές τίτλου και επίπεδες κουτάκια για κουμπιά. Δεν υπάρχει αμφιβολία ότι τα προεπιλεγμένα στυλ είναι εντελώς όμορφα.
Αυτό μπορεί να μην είναι για όλους όσους αγαπούν, ανάλογα με τις ανησυχίες επωνυμίας, αλλά είναι αρκετά απλό να αλλάξει. Μετά από όλα, η Base έχει να κάνει με την προσαρμογή.
Τα γνωρίσματα
Η βάση παρέχεται τόσο σε εκδόσεις LESS όσο και σε SASS, ώστε να μπορείτε να αλλάξετε γρήγορα τις μεταβλητές και να "επανασυσκευάσετε" τις ανάγκες σας. Οι ενσωματωμένες μεταβλητές περιλαμβάνουν τα μεγέθη γραμματοσειρών, τα σημεία θραύσης, τα κύρια πλάτη δοχείων για κάθε σημείο διάλειμμα και πολλά άλλα.
Υπάρχουν πολλές επιπλέον κλάσεις για να σας βοηθήσουμε να ρυθμίσετε τις συγκεκριμένες διατάξεις για κινητά και υπάρχουν "mixins" σε ένα ξεχωριστό αρχείο για να σας βοηθήσουν στο δρόμο σας.
Όπως το Kube, δεν υπάρχουν επιπλέον στοιχεία UI πέρα από αυτά που έρχονται με HTML από προεπιλογή, οπότε αν θέλετε διασυνδέσεις με καρτέλες, ακορντεόν και τα παρόμοια, θα πρέπει να τα κάνετε μόνοι σας. Η βάση φαίνεται να είναι προσανατολισμένη προς την κατασκευή όμορφων ιστότοπων σε αντίθεση με τις εφαρμογές ιστού .
συμπέρασμα
Εάν χτίζετε έναν ιστότοπο που δεν χρειάζεται πάρα πολλά συστατικά UI συγκεκριμένης εφαρμογής, τότε η βάση είναι ένας φανταστικός πόρος. Οι σελίδες που έχουν κατασκευαστεί με αυτό ήδη φαίνονται αρκετά. αλλά αν δεν σας αρέσουν τα προεπιλεγμένα στυλ, δεν είναι πολύ δύσκολο να τα αλλάξετε.
