Πολλοί άνθρωποι που είναι νέοι στο σχεδιασμό ιστοσελίδων και στο HTML / CSS χρησιμοποιούν το και Το στοιχείο div ορίζει λογικές διαιρέσεις στην ιστοσελίδα σας. Είναι βασικά ένα πλαίσιο στο οποίο μπορείτε να τοποθετήσετε άλλα στοιχεία HTML που λογικά συνδυάζονται. Μια διαίρεση μπορεί να έχει πολλά άλλα στοιχεία σε αυτήν, όπως παραγράφους, επικεφαλίδες, λίστες, συνδέσμους, εικόνες κ.λπ. Μπορεί να έχει ακόμη και άλλα τμήματα μέσα σε αυτήν για να παρέχει πρόσθετη δομή και οργάνωση στο έγγραφο HTML. Για να χρησιμοποιήσετε το στοιχείο div, τοποθετήστε το ανοιχτό id = "myDiv">
) ή ένας επιλογέας τάξης (π.χ., class = "bigDiv"> Το στοιχείο div είναι διαφορετικό από το στοιχείο της ενότητας HTML5, επειδή δεν δίδει το περιεχόμενό του σε οποιοδήποτε σημασιολογικό νόημα. Αν δεν είστε σίγουροι αν το μπλοκ περιεχομένου θα πρέπει να είναι div ή τμήμα, σκεφτείτε ποιος είναι ο σκοπός του στοιχείου και του περιεχομένου για να σας βοηθήσει να αποφασίσετε ποια θα χρησιμοποιήσετε: Τελικά, και τα δύο τμήματα και τα τμήματα συμπεριφέρονται αρκετά παρόμοια και μπορείτε να δώσετε σε οποιαδήποτε από αυτές τις τιμές των χαρακτηριστικών και το στυλ τους με το CSS για να αποκτήσετε την εμφάνιση του ιστότοπού σας που χρειάζεστε. Και τα δύο είναι στοιχεία επιπέδου μπλοκ. Το στοιχείο span είναι ένα στοιχείο inline από προεπιλογή. Αυτό το ξεχωρίζει από τα στοιχεία του div και του τμήματος. Το στοιχείο span χρησιμοποιείται συχνά για να τυλίξει ένα συγκεκριμένο κομμάτι περιεχομένου, συνήθως κείμενο, για να του δώσει ένα πρόσθετο "άγκιστρο" που μπορεί να μορφοποιηθεί αργότερα. Χρησιμοποιείται με το CSS, αλλάζει το στυλ του κειμένου που περικλείει. Ωστόσο, χωρίς χαρακτηριστικά γνωρίσματα στυλ, το στοιχείο span μόνο δεν έχει καμία επίδραση στο κείμενο καθόλου. Αυτή είναι η κύρια διαφορά μεταξύ των διαστημάτων span και div. Όπως αναφέρθηκε παραπάνω, το στοιχείο div περιλαμβάνει ένα σπάσιμο παραγράφου, ενώ το στοιχείο span απλώς λέει στο πρόγραμμα περιήγησης να εφαρμόσει τους σχετικούς κανόνες στυλ CSS σε αυτό που περικλείεται από το ετικέτες: Υψηλό κείμενο και μη επισημασμένο κείμενο. Πρόσθεσε το class = "highlight"
ή άλλη κλάση στο στοιχείο span για το στυλ του κειμένου με CSS (π.χ., class = "highlight">
). Το στοιχείο span δεν έχει τα απαιτούμενα χαρακτηριστικά, αλλά τα τρία που είναι τα πιο χρήσιμα είναι τα ίδια με αυτά του στοιχείου div: Χρησιμοποιήστε το άνοιγμα όταν θέλετε να αλλάξετε το στυλ του περιεχομένου χωρίς να ορίσετε αυτό το περιεχόμενο ως νέο στοιχείο σε επίπεδο μπλοκ στο έγγραφο. Για παράδειγμα, αν θέλετε η δεύτερη λέξη μιας επικεφαλίδας h3 να είναι κόκκινη, θα μπορούσατε να περιβάλλετε τη λέξη με ένα στοιχείο span που θα χαρακτήριζε τη λέξη ως κόκκινο κείμενο. Η λέξη εξακολουθεί να παραμένει μέρος του στοιχείου h3, αλλά τώρα εμφανίζεται επίσης με κόκκινο χρώμα: Χρησιμοποιώντας το
). Και τα δύο αυτά χαρακτηριστικά μπορούν στη συνέχεια να επιλεγούν χρησιμοποιώντας CSS ή να τροποποιηθούν χρησιμοποιώντας JavaScript. Οι τρέχουσες βέλτιστες πρακτικές κλίνουν προς τη χρήση επιλογών τάξης αντί για αναγνωριστικά, εν μέρει εξαιτίας του τρόπου με τον οποίο είναι συγκεκριμένοι οι επιλογείς ταυτότητας. Στην πραγματικότητα, ωστόσο, θα μπορούσατε να χρησιμοποιήσετε ένα από τα δύο και μπορεί να δώσει μια διαίρεση τόσο ID και έναν επιλογέα τάξης
Χρησιμοποιώντας το Στοιχείο
Αυτή είναι η μυθική τίτλος μου
τα στοιχεία σε εναλλασσόμενο τρόπο καθώς δημιουργούν ιστοσελίδες. Η πραγματικότητα, ωστόσο, είναι ότι κάθε ένα από αυτά τα στοιχεία HTML εξυπηρετεί διαφορετικούς σκοπούς. Η εκμάθηση της χρήσης του καθενός για τον επιδιωκόμενο σκοπό σας θα σας βοηθήσει να αναπτύξετε καθαρότερες ιστοσελίδες, των οποίων ο κώδικας είναι ευκολότερο να διαχειριστεί συνολικά.
Στοιχείο
ετικέτα πριν από την περιοχή της σελίδας σας που θέλετε ως ξεχωριστό τμήμα και ένα κλείσιμο
ετικέτα μετά από αυτό:
περιεχόμενο του διαστήματος
Αν η περιοχή της σελίδας σας χρειάζεται ορισμένες πρόσθετες πληροφορίες που θα χρησιμοποιήσετε για να στυλ με CSS αργότερα, μπορείτε να προσθέσετε έναν επιλογέα ταυτότητας (π.χ.,
Εναντίον