Η εργαλειοθήκη του συστήματος πλέγματος 960 και οι πόροι
Το σύστημα 960 Grid δημιουργήθηκε από τον Nathan Smith ως έναν τρόπο εξομάλυνσης της ροής εργασίας του web development με την παροχή κοινώς χρησιμοποιούμενων διαστάσεων, με βάση το πλάτος των 960 pixel.
Το 960.gs (ή οποιοδήποτε πλαίσιο CSS) αναπτύχθηκε κυρίως για γρήγορη δημιουργία πρωτοτύπων, μειώνοντας τα επαναλαμβανόμενα και κουραστικά καθήκοντα, αλλά είναι επίσης πολύ κατάλληλο για χρήση σε οποιοδήποτε σχέδιο web design.
Θα δώσει στον ιστότοπό σας ένα δομημένο και σταθερό υπόβαθρο για να δημιουργήσετε και να σχεδιάσετε το σχεδιασμό σας.
Σε αυτό το άρθρο, θα βρείτε tutorials, μια παρουσίαση ιστοτόπων που έχουν σχεδιαστεί με χρήση των 960.gs, spin offs, βασικά θέματα WP που χτίζονται στο 960.gs και πιθανά εναλλακτικά πλαίσια, αν για κάποιο λόγο δεν σας αρέσει το 960 πλέγμα Σύστημα.
Μέσα στο πακέτο λήψης υπάρχουν εκτυπώσιμα φύλλα σκίτσου, σχεδιαγράμματα και ένα αρχείο CSS με ταυτόσημες μετρήσεις.
Έχετε δύο πρότυπα, ένα 12 πλέγμα στήλης διαιρούμενο σε τμήματα των 60px και ένα πλέγμα 16 στηρίγματος διαιρούμενο σε 40px. Κάθε στήλη έχει 10 εικονοστοιχεία των περιθωρίων στα αριστερά και στα δεξιά, τα οποία δημιουργούν υδρογράμματα πλάτους 20 εικονοστοιχείων μεταξύ των στηλών.
Ιστοσελίδα: Αρχική σελίδα 960.gs .
Κατεβάστε : Κατεβάστε το 960.gs .
Επίδειξη: Προβολή της σελίδας επίδειξης 960.gs .
960.gs Tutorials
960 CSS Framework - Μάθετε τα βασικά
Αυτό είναι ένα μεγάλο βασικό φροντιστήριο για να ξεκινήσετε, γράφοντας από τον Stefan Vervoort από τον divitodesign. Βγάζετε τα βασικά της φόρτωσης του πλαισίου, ώστε να μπορείτε να αρχίσετε να αναπτύσσεστε γρήγορα με το 960.gs.
Εργασία με το 960.gs
Ένα άλλο σεμινάριο που θα σας καθοδηγήσει στα βασικά της εγκατάστασης του 960.gs, ιδιαίτερα χρήσιμο για την πρόκληση του CSS.
Μια λεπτομερή ματιά στο 960 CSS πλαίσιο
Μόλις πάρετε την ευκαιρία να περάσετε λίγο χρόνο με το 960.gs, θα εκπλαγείτε με το πόσο χρόνο μπορεί να σωθεί κατά την ανάπτυξη των web projects σας.
Πρωτότυπο με το πλέγμα 960 CSS
Αυτό το άρθρο καλύπτει ολόκληρη τη διαδικασία του πρωτοτύπου, εξηγεί τα βασικά στοιχεία του Grid 960, σχεδιάζει το πλέγμα για ένα σχέδιο και κωδικοποιεί το πρωτότυπο. Τόσο γρήγορα.
Δημιουργήστε ένα θέμα εφημερίδας με το WP_Query και το πλαίσιο 960 CSS
Αυτό το σεμινάριο θα σας διδάξει πώς να χρησιμοποιήσετε το WP_Query για να δημιουργήσετε ένα θέμα 3 εφημερίδων, το οποίο θα περιέχει όλες τις κύριες αναρτήσεις ιστολογίου σας στην κεντρική στήλη και θα αφαιρέσει στο πλάι ένα σύνολο θέσεων από μια επιλεγμένη κατηγορία. Χρησιμοποιώντας το πλαίσιο 960 CSS για τη διάταξη και το υπόλοιπο του θέματος, θα δείξετε πώς αυτό θα επιταχύνει σημαντικά την παραγωγικότητά σας.
Σχεδιάστε ένα φρέσκο θέμα blog στο 960 πλέγμα
Αυτό το σεμινάριο σας διδάσκει να χρωματίσετε ένα θέμα blog στο Photoshop που έχει σχεδιαστεί για να χρησιμοποιηθεί μέσα στο πλαίσιο 960. Αυτό το σεμινάριο σχεδιάστηκε περισσότερο για τη θεωρία του σχεδιασμού ιστοσελίδων από την τεχνική Photoshop, αλλά ξοδεύει πολύ περισσότερο χρόνο στη θεωρία του σχεδιασμού και στην εφαρμογή.
960 Spin Offs
Typogridphy - Ένα τυπογραφικό πλαίσιο και το CSS Framework Layout Grid
Το Typogridphy είναι ένα πλαίσιο CSS που έχει σχεδιαστεί για να επιτρέπει στους σχεδιαστές ιστοσελίδων και στους προγραμματιστές του front-end να κωδικοποιούν γρήγορα τυπογραφικά ευχάριστες διατάξεις πλέγματος. Σας επιτρέπει να δημιουργήσετε σχεδιαγράμματα πλέγματος τα οποία είναι ευπροσάρμοστα και ελκυστικά, επικυρώνει τα αυστηρά xHTML και CSS. Χρησιμοποιεί επίσης μια τυπογραφική μέθοδο γνωστή ως «δημιουργία κατακόρυφου ρυθμού» , όπου όλες οι γειτονικές γραμμές κειμένου ευθυγραμμίζονται οριζόντια, ανεξάρτητα από τις διαχωριστικές γραμμές και τις νέες παραγράφους.
Επίδειξη: Χαρακτηριστικά τύπου
Overture - Fluid 960 Grid System 1.0
Αναπτύχθηκε από τον Stephen Bau από το Design7 , έχει δημιουργήσει μια βιβλιοθήκη κοινώς χρησιμοποιούμενων στοιχείων HTML, συνδυάζοντας αυτά με το CSS για τυπογραφία και διάταξη και προσθέτοντας μερικά βασικά αποτελέσματα από τις δημοφιλείς βιβλιοθήκες JavaScript (κυρίως MooTools). Με τη λήψη μπορείτε να επιλέξετε από τρία πρότυπα: σταθερό πλάτος 960 px, πλάτος υγρού 12 στηλών ή πλάτος υγρού 16 στηλών . Αυτά τα πρότυπα είναι καταπληκτικά, πρέπει να δείτε τις λεπτομέρειες για να το πιστέψετε.
Επίδειξη: Επίδειξη Overture .
Βιτρίνα
Όλες οι όμορφες τοποθεσίες που ακολουθούν έχουν κατασκευαστεί χρησιμοποιώντας το σύστημα πλέγματος 960:
WordPress Θέματα
Ακριβώς όπως το πραγματικό 960.gs, αυτά τα WP θέματα είναι σχεδόν unstyled και με πολύ βασική λειτουργικότητα, αλλά χτίστηκαν χρησιμοποιώντας τα 960gs.gr Πολύ χρήσιμο για οποιονδήποτε προγραμματιστή WP.
5 χρόνια WordPress Θέμα
Ένα βασικό θέμα WP χτισμένο χρησιμοποιώντας τα 960gs.gr
Θέμα WordPress 960bc
Το θέμα 960bc είναι ουσιαστικά ένας κενός καμβάς με ελάχιστο στυλ και καμία εικόνα που βασίζεται στο σύστημα πλέγματος 960 (μόνο 12 στήλες) για προγραμματιστές του WordPress που επιθυμούν να εργαστούν μέσα σε μια παραδοσιακή διάταξη με βάση το δίκτυο.
Πιθανές εναλλακτικές λύσεις
Η επιλογή ενός πλαισίου CSS μπορεί να είναι δύσκολη, αν το 960.gs δεν είναι σωστό για εσάς, ίσως μπορείτε να δοκιμάσετε μερικά από τα παρακάτω πλαίσια.
Σχέδιο: Πλαίσιο CSS
Το Blueprint είναι ένα πλαίσιο CSS, το οποίο στοχεύει να μειώσει τον χρόνο ανάπτυξης του CSS. Σας δίνει ένα σταθερό υπόβαθρο CSS για να δημιουργήσετε το έργο σας πάνω από το, με ένα εύχρηστο πλέγμα, λογική τυπογραφία και ακόμη και ένα φύλλο στυλ για εκτύπωση. Είναι πολύ λιγότερο φουσκωμένο από το πλαίσιο YUI, και είναι ίσως ίσο με το 960.gs όσον αφορά την ευκολία χρήσης.
CSS-Boilerplate
Από έναν από τους συγγραφείς του Blueprint. Έχει δημιουργήσει ένα απογυμνωμένο πλαίσιο το οποίο παρέχει τα βασικά στοιχεία για να ξεκινήσει οποιοδήποτε έργο. Αυτό το πλαίσιο είναι ελαφρύ και προσπαθεί να μην προτείνει μη σημασιολογικές συμβάσεις ονομασίας.
Στοιχεία - Πλαίσιο CSS προς τα κάτω
Κατασκευάστηκε για να βοηθήσει τους σχεδιαστές να γράψουν CSS ταχύτερα και πιο αποτελεσματικά. Τα στοιχεία υπερβαίνουν το πλαίσιο, είναι δική της δουλειά έργου. Διαθέτει όλα όσα χρειάζεστε για να ολοκληρώσετε το έργο σας.
WYMstyle - πλαίσιο CSS - Επισκόπηση
Ο στόχος αυτού του έργου είναι η παροχή ενός συνόλου καλά δοκιμασμένων αρθρωτών αρχείων CSS, τα οποία μπορούν να χρησιμοποιηθούν για γρήγορο σχεδιασμό ιστοσελίδων.
Ακόμα μια Διάταξη Πολλαπλών Χορδών | YAML
"Ακόμα μια Διάταξη Multicolumn" (YAML) είναι ένα πλαίσιο (X) HTML / CSS για τη δημιουργία σύγχρονων και ευέλικτων πλωτών διατάξεων. Η δομή είναι εξαιρετικά ευέλικτη στον προγραμματισμό της και είναι προσιτή στους τελικούς χρήστες.
CleverCSS
Το CleverCSS είναι μια μικρή γλώσσα σήμανσης για το CSS που εμπνέεται από την Python και μπορεί να χρησιμοποιηθεί για την κατασκευή ενός φύλλου στυλ με έναν καθαρό και δομημένο τρόπο. Με πολλούς τρόπους είναι καθαρότερο και ισχυρότερο από το CSS2.
sparkl CSS Framework
Το Sparkl συνδυάζει την σήμανση POSH, το Bulletproof CSS και το Unobtrusive JavaScript σε ένα εύχρηστο πλαίσιο ανάπτυξης ιστοσελίδων που καθιστά απλή τη δημιουργία αλεξίσφαιρων ιστότοπων που συμμορφώνονται με τα πρότυπα του ιστού. Χρησιμοποιεί ένα δομοστοιχειωτό πλαίσιο, το οποίο σας επιτρέπει να χρησιμοποιήσετε ό, τι χρειάζεστε και να αφήσετε αυτό που δεν έχετε.
Το jQuery UI CSS Framework
Το ερωτηματολόγιο UI περιλαμβάνει ένα ισχυρό πλαίσιο CSS που έχει σχεδιαστεί για τη δημιουργία προσαρμοσμένων widgets του jQuery. Το πλαίσιο περιλαμβάνει κατηγορίες που καλύπτουν μια μεγάλη γκάμα κοινών αναγκών διεπαφής χρήστη και μπορούν να χρησιμοποιηθούν με τη χρήση του jQuery UI ThemeRoller. Με την οικοδόμηση των στοιχείων UI σας χρησιμοποιώντας το jQuery UI CSS Framework, θα υιοθετήσετε κοινές συμβάσεις σήμανσης και επιτρέποντας την ευκολία της ενσωμάτωσης κώδικα σε ολόκληρη την κοινότητα plugin.
Γράφτηκε αποκλειστικά για το WDD από τον Paul Andrew από το Speckyboy.com
Χρησιμοποιείτε τα 960gs για τους ιστοτόπους σας; Ποια είναι τα κύρια πλεονεκτήματα; Θα θέλαμε να σας ακούσουμε ...