Η συμπερίληψη παρατηρήσεων στον κώδικα CSS είναι χρήσιμη και συνιστάται ιδιαίτερα.
Κάθε ιστοσελίδα αποτελείται από δομικά στοιχεία (τα οποία υπαγορεύονται από HTML), καθώς και το οπτικό στυλ ή "εμφάνιση και αίσθηση" αυτού του ιστότοπου. Τα επικαλυπτόμενα φύλλα στυλ (CSS) είναι αυτά που χρησιμοποιούνται για να υπαγορεύσουν την οπτική εμφάνιση ενός ιστότοπου. Αυτά τα στυλ διατηρούνται ξεχωριστά από τη δομή HTML ώστε να επιτρέπουν την εύκολη ενημέρωση και την τήρηση των προτύπων Web.
Με το μέγεθος της πολυπλοκότητας πολλών ιστοσελίδων σήμερα, τα φύλλα στυλ μπορούν γρήγορα να γίνουν αρκετά μακρά και πολύ δυσκίνητα για να συνεργαστείτε. Αυτό ισχύει ιδιαίτερα όταν αρχίζετε να προσθέτετε ερωτήματα μέσων για στυλ ιστοτόπων που ανταποκρίνονται . Αυτά τα ερωτήματα μέσων μόνο μπορούν να προσθέσουν ένα σημαντικό αριθμό νέων στυλ σε ένα έγγραφο CSS και καθιστώντας ακόμη πιο δύσκολο να εργαστείτε με. Αυτό είναι όπου τα σχόλια CSS μπορούν να γίνουν μια ανεκτίμητη βοήθεια σε έναν ιστότοπο.
Η προσθήκη σχολίων στα αρχεία CSS ενός ιστότοπου είναι ένας πολύ καλός τρόπος για να προσθέσετε δομή σε τμήματα αυτού του κώδικα για έναν αναγνώστη ανθρώπων που εξετάζει το έγγραφο. Είναι επίσης μια θαυμάσια μέθοδος για να εξηγήσετε αυτά τα στυλ για έναν επαγγελματία Ιστού που μπορεί να χρειαστεί να εργαστεί στο χώρο στο μέλλον - συμπεριλαμβανομένου και του εαυτού σας!
Στο τέλος, τα έξυπνα αποσπασμένα σχόλια CSS θα διευκολύνουν την επεξεργασία ενός φύλλου στυλ. Αυτό είναι, πράγματι, σημαντικό για τα φύλλα στυλ που θα επεξεργαστούν από ομάδες. Σχόλια μπορούν να χρησιμοποιηθούν για την επικοινωνία σημαντικών πτυχών του φύλλου στυλ σε διάφορα μέλη της ομάδας που μπορεί να μην είναι εξοικειωμένοι με τον κώδικα ήδη. Αυτά τα σχόλια μπορεί επίσης να είναι πολύ χρήσιμα για τους ανθρώπους που έχουν εργαστεί στον ιστότοπο πριν αν επιστρέψουν στον κώδικα μετά από να παραμείνουν μακριά από αυτό για κάποιο χρονικό διάστημα. Έχω συχνά αναγκαστεί να επεξεργαστώ μια ιστοσελίδα που έχτισα μήνες ή ακόμα και χρόνια και έχοντας καλά μορφοποιημένα σχόλια στο HTML και CSS είναι πολύ ευπρόσδεκτη βοήθεια! Θυμηθείτε, μόνο επειδή δημιουργήσατε έναν ιστότοπο δεν σημαίνει ότι θα θυμηθείτε γιατί κάνατε τα πράγματα που κάνατε όταν επιστρέψατε στον ιστότοπο στο μέλλον! Τα σχόλια μπορούν να κάνουν τις προθέσεις σας σαφείς και να ξεκαθαρίσουν τυχόν παρεξηγήσεις πριν συμβούν ακόμη.
Ένα πράγμα που πρέπει να καταλάβετε για τα σχόλια CSS είναι ότι δεν εμφανίζονται όταν η σελίδα εμφανίζεται σε προγράμματα περιήγησης ιστού. Αυτά τα σχόλια είναι μόνο ενημερωτικά, ακριβώς όπως τα σχόλια HTML (αν και η σύνταξη είναι διαφορετική μεταξύ των δύο). Αυτά τα σχόλια CSS δεν επηρεάζουν την οπτική εμφάνιση ενός ιστότοπου με οποιονδήποτε τρόπο και είναι απλά παρόντα στον ίδιο τον κώδικα.
Προσθήκη σχολίων CSS
Η προσθήκη ενός σχολίου CSS είναι αρκετά εύκολη. Μπορείτε απλά να αφήσετε το σχόλιό σας με τις σωστές ετικέτες σχολίων έναρξης και λήξης:
- Ξεκινήστε το σχόλιό σας προσθέτοντας /
- Κλείστε το σχόλιό σας προσθέτοντας * /
Οτιδήποτε εμφανίζεται μεταξύ αυτών των δύο ετικετών θα είναι το περιεχόμενο του σχολίου, ορατό μόνο στον κώδικα και που δεν εμφανίζεται από το πρόγραμμα περιήγησης.
Ένα σχόλιο CSS μπορεί να είναι μία γραμμή, ή μπορεί να λάβει πολλές γραμμές. Ακολουθεί ένα παράδειγμα γραμμής:
div # border_red {όριο: λεπτό στερεό κόκκινο; } / * παράδειγμα κόκκινου περιγράμματος * /Και ένα παράδειγμα πολλαπλών γραμμών:
/ *************************** ********************** ****** Στυλ για κώδικα κειμένου **************************** ************ *************** /Διαχωρίζοντας τμήματα
Ένας από τους τρόπους με τους οποίους συχνά χρησιμοποιώ τα σχόλια CSS είναι να οργανώσω το φύλλο στυλ μου σε μικρότερα, πιο εύκολα απορρίψιμα κομμάτια. Μου αρέσει να βλέπω εύκολα αυτές τις ενότητες όταν εξετάζω το αρχείο αργότερα. Για να γίνει αυτό, συχνά προσθέτω σχόλια με πολλά παύλα σε αυτά, ώστε να παρέχουν μεγάλα, προφανή διαλείμματα στη σελίδα που είναι εύκολο να δουν καθώς μετακινώ γρήγορα τον κώδικα. Ακολουθεί ένα παράδειγμα:
/ * ----------------------- Στυλ κεφαλίδας ----------------------- ------- * /Όταν βλέπω ένα από αυτά τα σχόλια στον κώδικα μου, ξέρω ότι είναι η αρχή μιας νέας ενότητας αυτού του εγγράφου, επιτρέποντάς μου να επεξεργαστώ και να χρησιμοποιήσω πιο εύκολα τον κώδικα.
Σχόλια & # 34; Κώδικας
Οι ετικέτες σχολίων μπορούν επίσης να είναι χρήσιμες στην πραγματική διαδικασία της κωδικοποίησης και της αποσφαλμάτωσης μιας σελίδας. Τα σχόλια μπορούν να χρησιμοποιηθούν για να σχολιάσουν ή να απενεργοποιήσουν τις περιοχές αυτού του κώδικα, για να δουν τι συμβαίνει εάν η ενότητα αυτή δεν αποτελεί μέρος της σελίδας.
Λοιπόν, πώς λειτουργεί αυτό; Λοιπόν, επειδή οι ετικέτες σχολίων λένε στο πρόγραμμα περιήγησης να αγνοούν τα πάντα μεταξύ τους, μπορείτε να τα χρησιμοποιήσετε για να απενεργοποιήσετε προσωρινά ορισμένα τμήματα του κώδικα CSS. Αυτό μπορεί να είναι βολικό όταν εντοπίζετε σφάλματα ή όταν ρυθμίζετε τη μορφοποίηση ιστοσελίδων.
Για να το κάνετε αυτό, απλώς προσθέστε την ετικέτα του εισαγωγικού σχολίου όπου θέλετε να ξεκινήσει ο κώδικας και, στη συνέχεια, τοποθετήστε αυτήν την τελική ετικέτα όπου θέλετε να τερματίσει το τμήμα με ειδικές ανάγκες. Τα πάντα μεταξύ αυτών των ετικετών δεν θα επηρεάσουν την οπτική εμφάνιση ενός ιστότοπου, επιτρέποντάς σας να διορθώσετε το CSS για να δείτε πού μπορεί να συμβεί κάποιο πρόβλημα. Στη συνέχεια, μπορείτε να εισέλθετε και να διορθώσετε μόνο αυτό το ζήτημα και να καταργήσετε τα σχόλια από τον κώδικα.
CSS σχολιάζοντας συμβουλές
Ως ανακεφαλαίωση, εδώ είναι μερικές συμβουλές για να θυμάστε για τη χρήση σχολίων στο CSS σας:
- Τα σχόλια μπορούν να περιληφθούν σε πολλές γραμμές.
- Τα σχόλια μπορούν να περιλαμβάνουν στοιχεία CSS που δεν θέλετε να αναπαραχθούν από ένα πρόγραμμα περιήγησης, αλλά δεν θέλετε να διαγράψετε τελείως. Αυτός είναι ένας καλός τρόπος για να διορθώσετε τα φύλλα στυλ ενός ιστότοπου - απλά φροντίστε να αφαιρέσετε τα αχρησιμοποίητα στυλ (σε αντίθεση με την αφήγηση τους σχολιάζονται) εάν αποφασίσετε ότι δεν τα χρειάζεστε στον ιστότοπο
- Χρησιμοποιήστε σχόλια κάθε φορά που γράφετε περίπλοκο CSS για να προσθέσετε διευκρινίσεις και να ενημερώσετε τους μελλοντικούς προγραμματιστές ή τον εαυτό σας στο μέλλον σχετικά με σημαντικά πράγματα που πρέπει να γνωρίζουν. Αυτό θα εξοικονομήσει χρόνο μελλοντικής ανάπτυξης για όλους τους εμπλεκόμενους.
- Τα σχόλια μπορούν επίσης να περιλαμβάνουν μετα-πληροφορίες όπως:
- συγγραφέας
- Ημερομηνία Δημιουργίας
- πληροφορίες πνευματικών δικαιωμάτων
Εκτέλεση
Τα σχόλια μπορούν σίγουρα να είναι χρήσιμα, αλλά να γνωρίζετε ότι τα περισσότερα σχόλια που προσθέτετε σε ένα φύλλο στυλ, θα είναι το πιο heftier που θα επηρεάσει την ταχύτητα και την απόδοση του site. Αυτό είναι μια πραγματική ανησυχία, αλλά δεν πρέπει να διστάσετε να προσθέσετε χρήσιμα και νόμιμα σχόλια για το φόβο ότι η απόδοση θα υποφέρει. Οι γραμμές CSS δεν προσθέτουν σημαντικό μέγεθος σε ένα έγγραφο. Θα χρειαστεί να προσθέσετε τόνοι γραμμών σχολίων για να επηρεάσετε σημαντικά το μέγεθος του αρχείου CSS. Η προσθήκη μιας χούφτας χρήσιμων σχολίων στο CSS σας δεν θα πρέπει να σας δίνει αρνητικές αρνητικές επιπτώσεις στην ταχύτητα της σελίδας.
Στο τέλος, θα θελήσετε να βρείτε την ισορροπία ανάμεσα σε χρήσιμα σχόλια και πάρα πολλά σχόλια για να έχετε τα οφέλη και των δύο εγγράφων CSS.
Αρχικό άρθρο από την Jennifer Krynin. Επεξεργασμένο από τον Jeremy Girard στις 7/5/17