Προγραμματισμός μάθησης: Ποια είναι η διαφορά μεταξύ ορατότητας: κρυφή και προβολής: καμία;


Απάντηση 1:

η ορατότητα κανένας δεν αφήνει χώρο για το στοιχείο στη σελίδα. Δεν το αφαιρεί από τη σελίδα.

η εμφάνιση κανένας δεν αφαιρεί το στοιχείο από την κανονική ροή της σελίδας επιτρέποντας την συμπλήρωση άλλων στοιχείων. Είναι ακόμη προσβάσιμη μέσω του DOM.

Αυτή δεν είναι η πλήρης εξήγηση, αλλά αρκεί να πάτε.


Απάντηση 2:

Χρησιμοποιώντας την οθόνη: καμία, το αποτέλεσμα θα ήταν το ίδιο όπως και αν απλά διαγράψατε το στοιχείο από την ιστοσελίδα εντελώς.

Το πρόγραμμα περιήγησης δεν θα αποδώσει το στοιχείο ή τα παιδιά, παρόλο που θα είναι ακόμα εκεί και μπορείτε να το τροποποιήσετε χρησιμοποιώντας CSS ή JavaScript.

Ας δούμε το παράδειγμα.

HTML:

Πρώτη
Δεύτερο
Τρίτο

Και το CSS:

.box1, .box-2, .box-3 {
    ύψος: 30px;
}}

.box-2 {
    οθόνη: καμία ·
}}

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

Τώρα, αντί της απεικόνισης: κανένα, βάλτε την ορατότητα: κρυμμένη εκεί.

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