Δείτε το HTML και το CSS οποιασδήποτε ιστοσελίδας
Ο ιστότοπος είναι χτισμένος με γραμμές κώδικα , αλλά το αποτέλεσμα είναι συγκεκριμένες σελίδες με εικόνες, βίντεο, γραμματοσειρές και άλλα. Για να αλλάξετε ένα από αυτά τα στοιχεία ή να δείτε τι αποτελείται από αυτό, θα πρέπει να βρείτε τη συγκεκριμένη γραμμή κώδικα που τον ελέγχει. Μπορείτε να το κάνετε αυτό με ένα εργαλείο επιθεώρησης στοιχείων.
Τα περισσότερα προγράμματα περιήγησης ιστού δεν σας κάνουν να κατεβάσετε ένα εργαλείο ελέγχου ή να εγκαταστήσετε ένα πρόσθετο. Αντ 'αυτού, σας επιτρέπουν να κάνετε δεξί κλικ στο στοιχείο της σελίδας και να επιλέξετε Έλεγχος ή επιθεώρηση στοιχείου . Ωστόσο, η διαδικασία μπορεί να είναι λίγο διαφορετική στο πρόγραμμα περιήγησης.
Επιθεωρήστε στοιχεία στο Chrome
Οι πιο πρόσφατες εκδόσεις του Google Chrome σάς επιτρέπουν να επιθεωρήσετε τη σελίδα με μερικούς τρόπους, οι οποίοι χρησιμοποιούν όλα τα ενσωματωμένα Chrome DevTools:
- Κάντε δεξί κλικ σε κάτι στη σελίδα (ή σε μια κενή περιοχή) και επιλέξτε Έλεγχος
- Εισαγάγετε τη συντόμευση Ctrl + Shift + I
- Χρησιμοποιήστε το μενού του Chrome για να αποκτήσετε πρόσβαση στην επιλογή Περισσότερα εργαλεία> Εργαλεία προγραμματιστή
Τα Chrome DevTools σας επιτρέπουν να κάνετε πράγματα όπως να αντιγράψετε ή να επεξεργαστείτε εύκολα γραμμές HTML ή να αποκρύψετε ή να διαγράψετε στοιχεία συνολικά (έως ότου η σελίδα επαναφορτωθεί).
Μόλις το DevTools ανοίξει στο πλάι της σελίδας, μπορείτε να αλλάξετε τη θέση του, να το ξεφυλλίσετε από τη σελίδα, να αναζητήσετε όλα τα αρχεία της σελίδας, να επιλέξετε στοιχεία από τη σελίδα για συγκεκριμένη εξέταση, αντιγραφή αρχείων και διευθύνσεων URL και ακόμη και να προσαρμόσετε μια δέσμη των ρυθμίσεων.
Ελέγξτε Στοιχεία στον Firefox
Όπως το Chrome, ο Firefox έχει μερικούς διαφορετικούς τρόπους για να ανοίξει το εργαλείο του που ονομάζεται Inspector:
- Κάντε δεξιό κλικ σε μια κενή περιοχή στη σελίδα ή επιλέξτε ένα στοιχείο και επιλέξτε Έλεγχος στοιχείου
- Εισαγάγετε Ctrl + Shift + T ή Ctrl + Shift + I με το πληκτρολόγιο
- Από το μενού Firefox, κάντε κλικ στην επιλογή Developer > Inspector
- Από το μενού Εργαλεία , κάντε κλικ στην επιλογή Web Developer> Inspector
Καθώς μετακινείτε το ποντίκι σας πάνω από διάφορα στοιχεία του Firefox, το εργαλείο Επιθεωρητής βρίσκει αυτόματα τις πληροφορίες πηγαίου κώδικα του στοιχείου. Κάντε κλικ σε ένα στοιχείο και η αναζήτηση "on-the-fly" θα σταματήσει και μπορείτε να εξετάσετε το στοιχείο από το παράθυρο του Επιθεωρητή.
Κάντε δεξιό κλικ σε ένα στοιχείο για να βρείτε όλα τα υποστηριζόμενα στοιχεία ελέγχου. Μπορείτε να κάνετε πράγματα όπως να επεξεργαστείτε τη σελίδα ως HTML, να αντιγράψετε ή να επικολλήσετε εσωτερικό ή εξωτερικό κώδικα HTML, να εμφανίσετε ιδιότητες DOM, να διαγράψετε στιγμιότυπα ή να διαγράψετε τον κόμβο, να εφαρμόσετε εύκολα νέα χαρακτηριστικά, να δείτε ολόκληρο το CSS της σελίδας και πολλά άλλα.
Ελέγξτε Στοιχεία στην Όπερα
Η Opera μπορεί επίσης να επιθεωρήσει τα στοιχεία, με το εργαλείο DOM Inspector που είναι ίδιο με το Chrome. Εδώ είναι πώς να φτάσετε σε αυτό:
- Χρησιμοποιήστε τη συντόμευση πληκτρολογίου Ctrl + Shift + I
- Μεταβείτε στο Μενού> Περισσότερα εργαλεία> Εμφάνιση του μενού προγραμματιστών και, στη συνέχεια, ανοίξτε το μενού μέσω του Μενού> Προγραμματιστής> Εργαλεία για προγραμματιστές
- Από το μενού δεξί κλικ σε οποιοδήποτε στοιχείο της σελίδας, επιλέξτε Επιθεώρηση στοιχείου
Επιθεωρήστε τα στοιχεία στον Internet Explorer
Ένα παρόμοιο εργαλείο στοιχείο επιθεώρησης, που ονομάζεται Εργαλεία προγραμματιστή, είναι διαθέσιμο στον Internet Explorer:
- Πατήστε F12 στο πληκτρολόγιο
- Χρησιμοποιήστε την επιλογή Εργαλεία> Εργαλείο F12 για προγραμματιστές (πατήστε Alt + X αν δεν εμφανιστεί το μενού Εργαλεία )
- Κάντε δεξί κλικ στη σελίδα και κάντε κλικ στην επιλογή Επιθεώρηση στοιχείου
Το IE διαθέτει ένα εργαλείο επιλογής στοιχείων σε αυτό το νέο μενού το οποίο σας επιτρέπει να κάνετε κλικ σε οποιοδήποτε στοιχείο σελίδας για να δείτε τα στοιχεία του HTML και CSS. Μπορείτε επίσης να απενεργοποιήσετε / ενεργοποιήσετε την προβολή στοιχείων, ενώ κάνετε περιήγηση στην καρτέλα DOM Explorer .
Όπως και τα εργαλεία επιθεωρητών άλλων στοιχείων στα παραπάνω προγράμματα περιήγησης, ο Internet Explorer σάς επιτρέπει να κόβετε, να αντιγράφετε και να επικολλάτε στοιχεία καθώς και να επεξεργάζεστε το HTML, να προσθέτετε χαρακτηριστικά, να αντιγράφετε στοιχεία με συνημμένα στυλ και πολλά άλλα.