Ποιοι τρόποι υπάρχουν για να κρύψετε ένα HTML στοιχείο σε μια ιστοσελίδα;

• display: none; - το στοιχείο διαγράφεται εντελώς από τη ροή του εγγράφου, δεν καταλαμβάνει χώρο και τα γεγονότα δεν επεξεργάζονται. Ο πιο "δυνατός" τρόπος απόκρυψης.
• visibility: hidden; - το στοιχείο παραμένει στη ροή του εγγράφου, διατηρεί τη θέση του, αλλά δεν είναι ορατό. Τα γεγονότα ποντικιού και πληκτρολογίου δεν επεξεργάζονται.
• opacity: 0; - το στοιχείο παραμένει στη ροή του εγγράφου, διατηρεί τη θέση του, δεν είναι ορατό. Τα γεγονότα ποντικιού και πληκτρολογίου επεξεργάζονται (μπορεί να γίνει κλικ, να περάσει ο δείκτης κ.λπ.). Το στοιχείο γίνεται απλώς εντελώς διαφανές.
• position: absolute; και ορισμός συντεταγμένων εκτός της ορατής περιοχής (π.χ., left: -9999px;). Το στοιχείο αφαιρείται από τη φυσιολογική ροή, αλλά εξακολουθεί να υπάρχει στη σελίδα και μπορεί να επηρεάσει την κύλιση. Τα γεγονότα επεξεργάζονται.
• width: 0; height: 0; overflow: hidden; - το στοιχείο παραμένει στη ροή, αλλά οι διαστάσεις του μηδενίζονται. Τα γεγονότα μπορούν να επεξεργαστούν αν η περιοχή τους πέφτει στο ορατό μέρος ενός άλλου στοιχείου.
• font-size: 0; και line-height: 0; (για απόκρυψη περιεχομένου κειμένου). Διατηρεί το στοιχείο, αλλά καθιστά το κείμενό του αόρατο.
• Χρήση του ψευδο-στοιχείου :empty (όχι για όλα τα στοιχεία και περιπτώσεις). Απόκρυψη περιεχομένου αν το στοιχείο είναι κενό.

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