Πώς να δημιουργήσετε στυλ με τους επιλογείς κλάσης και αναγνωριστικού στο Dreamweaver - ανδρείκελοι

Οι επιλογείς κλάσης και αναγνωριστικού στο Dreamweaver έχουν πολλές ομοιότητες και μία διαφορά κλειδιού. Τα στυλ ταυτότητας μπορούν να χρησιμοποιηθούν μόνο μία φορά ανά σελίδα, αλλά τα στυλ τάξης μπορούν να χρησιμοποιηθούν πολλές φορές στην ίδια σελίδα που θέλετε.

Τα στυλ κατηγορίας και αναγνωριστικών έχουν τις ακόλουθες ομοιότητες:

Μπορείτε να ονομάσετε στυλ που δημιουργούνται με τους επιλογείς κλάσης και αναγνωριστικού οτιδήποτε θέλετε. Δεν πρέπει να συμπεριλαμβάνετε διαστήματα ή ειδικούς χαρακτήρες σε ονόματα στυλ, αν και η υπογράμμιση και το παύλα είναι εντάξει. Η χρήση όλων των πεζών είναι μια κοινή αλλά όχι απαραίτητη πρακτική.

Μπορείτε να εφαρμόσετε στυλ κατηγορίας και αναγνωριστικού σε οποιοδήποτε στοιχείο μιας σελίδας, αλλά συνήθως εφαρμόζονται σε ετικέτες κεφαλίδας, ετικέτες div, ετικέτες μη ταξινομημένων λιστών, ετικέτες παραγράφων, ετικέτες ετικετών και το νέο HTML5 ετικέτες.

Η χρήση των στυλ που δημιουργήθηκαν με τον επιλογέα κλάσης και αναγνωριστικού είναι μια διαδικασία δύο σταδίων. Αρχικά, δημιουργείτε ένα νέο στυλ χρησιμοποιώντας τον επιλογέα κλάσης ή αναγνωριστικού και δώστε το όνομα. τότε εφαρμόζετε το στυλ σε ένα στοιχείο της σελίδας.

1Αν ορίζετε ένα νέο στυλ που θέλετε ισχύουν για ένα υπάρχον στοιχείο, κάντε κλικ για να τοποθετήσετε τον κέρσορα πάνω από το στοιχείο που θέλετε να μορφοποιήσετε με το νέο στυλ.

Παρόλο που αυτό το βήμα δεν είναι απαραίτητο (μπορείτε να δημιουργήσετε στυλ για στοιχεία που δεν υπάρχουν ακόμα στη σελίδα), το Dreamweaver δημιουργεί αυτόματα ονόματα επιλογών βάσει του στοιχείου σελίδας που ο δρομέας σας επιλέγει αυτή τη στιγμή.

2Στον πίνακα επιλογών του πίνακα σχεδιαστή CSS, επιλέξτε το όνομα του φύλλου στυλ στο οποίο θέλετε να προσθέσετε το νέο στυλ.

Εάν θέλετε να στοχεύσετε το στυλ σε συγκεκριμένο τύπο μέσου ή μέγεθος οθόνης, ορίστε ένα ερώτημα μέσων στον πίνακα @Media.

Αν δεν καθορίσετε ένα ερώτημα μέσων, το Dreamweaver θα χρησιμοποιήσει την ιδιότητα Global και το στυλ σας θα λειτουργήσει σε όλες τις μορφές μέσων και τα μεγέθη οθόνης.

3Στον πίνακα επιλογών, κάντε κλικ στο σύμβολο συν (+).

Ένας νέος επιλογέας προστίθεται στον πίνακα επιλογής. Το Dreamweaver έχει προσθέσει ένα σύνθετο όνομα επιλογέα, το οποίο περιλαμβάνει όλα τα στυλ που έχουν ήδη εφαρμοστεί στην επικεφαλίδα, όπου ο δρομέας σας αναπαύεται όταν ξεκινήσατε να ορίζετε το στυλ.

4 Κάντε διπλό κλικ στο όνομα του επιλογέα και επεξεργαστείτε ή αντικαταστήστε το με το όνομα που θέλετε να χρησιμοποιήσετε για το στυλ σας.

Μπορείτε να ονομάσετε στυλ τάξης και αναγνωριστικού οτιδήποτε θέλετε, αρκεί να μην χρησιμοποιείτε διαστήματα ή ειδικούς χαρακτήρες διαφορετικούς από το παύλα (-) ή την υπογράμμιση (_).

Εάν θέλετε να δημιουργήσετε ένα στυλ χρησιμοποιώντας τον επιλογέα κλάσης, πρέπει να ξεκινήσετε το όνομα στυλ με μια κουκκίδα ή μια περίοδο.Αν θέλετε να χρησιμοποιήσετε τον επιλογέα ταυτότητας, το όνομα του στυλ πρέπει να ξεκινά με ένα σημάδι λιβρών (#).

5Στον πίνακα "Ιδιότητες", καθορίστε τις ρυθμίσεις του κανόνα στυλ.

Οι επιλογείς κλάσεων και αναγνωριστικών είναι εύκολο να εφαρμοστούν στο περιεχόμενο μετά τη δημιουργία τους, επειδή το Dreamweaver προσθέτει αυτά τα στυλ στις αναπτυσσόμενες λίστες Κλάσης και Αναγνωριστικού στον επιθεωρητή ιδιότητας που βρίσκεται στο κάτω μέρος του χώρου εργασίας.