Τα inline frames, συνήθως αναφέρονται μόνο ως "iframes", είναι ο μόνος τύπος πλαισίου που επιτρέπεται στο HTML5. Αυτά τα πλαίσια είναι ουσιαστικά ένα τμήμα της σελίδας σας που "κόψατε". Στο χώρο που έχετε αποκόψει από τη σελίδα, μπορείτε να τροφοδοτήσετε μια εξωτερική ιστοσελίδα. Στην ουσία, ένα iframe είναι ένα άλλο παράθυρο προγράμματος περιήγησης που βρίσκεται ακριβώς μέσα στην ιστοσελίδα σας. Ενεργοποιείτε iframes που χρησιμοποιούνται συνήθως σε ιστότοπους που πρέπει να περιλαμβάνουν εξωτερικό περιεχόμενο όπως έναν χάρτη Google ή ένα βίντεο από το YouTube. Και οι δύο δημοφιλείς ιστότοποι χρησιμοποιούν iframes στον ενσωματωμένο κώδικα τους.
Πώς να χρησιμοποιήσετε το στοιχείο IFRAME
Το στοιχείο χρησιμοποιεί τα παγκόσμια στοιχεία HTML5 καθώς και διάφορα άλλα στοιχεία. Τέσσερα είναι επίσης χαρακτηριστικά στο HTML 4.01:
- -Η διεύθυνση URL για την πηγή του πλαισίου
- -Το ύψος του παραθύρου
- -Το πλάτος του παραθύρου
- -Το όνομα του παραθύρου
Και τρεις είναι νέες στο HTML5:
srcdoc-Η HTML για την πηγή του πλαισίου. Αυτό το χαρακτηριστικό υπερισχύει έναντι οποιουδήποτε URL στοsrcΧαρακτηριστικόsandbox- μια λίστα χαρακτηριστικών που θα πρέπει να επιτρέπονται ή να απαγορεύονται στο παράθυρο πλαισίουχωρίς ραφή-Διαβάζει τον παράγοντα χρήστη ότι το iframe θα πρέπει να αποδίδεται σαν να είναι αόρατα μέρος του γονικού εγγράφου
Για να δημιουργήσετε ένα απλό iframe, ορίζετε τη διεύθυνση URL προέλευσης και το πλάτος και το ύψος:
Έχετε υπόψη ότι μπορείτε να επιλέξετε να μην χρησιμοποιείτε τιμές εικονοστοιχείων για τις ρυθμίσεις του iframe σας, αλλά μπορεί να αποφασίσετε να χρησιμοποιήσετε ένα ποσοστό. Εάν δημιουργείτε έναν ανταποκρινόμενο ιστότοπο του οποίου το μέγεθος θα πρέπει να αλλάξει με διαφορετικά μεγέθη οθόνης, αυτά τα ποσοστά θα είναι σημαντικά.
Υπάρχουν επίσης ορισμένα χαρακτηριστικά που ισχύουν στο HTML 4.01, αλλά έχουν ξεπερασθεί στο HTML5. Εφόσον οι περισσότεροι ιστότοποι σήμερα χρησιμοποιούν HTML5 +, αυτά τα χαρακτηριστικά είναι αυτά που δεν θα θέλετε να χρησιμοποιήσετε (αλλά τα οποία μπορείτε να δείτε σε ορισμένα έγγραφα παλαιού τύπου).
- -Όχι, χρησιμοποιήστε ένα
ΕΝΑστοιχείο για σύνδεση με μια περιγραφή - -Αντίθετα, χρησιμοποιήστε το CSS
φλοτέριδιοκτησία επιτρέψτε τη διαφάνεια-Αντίθετα, χρησιμοποιήστε το CSSΙστορικόιδιοκτησία για να γίνει το ifram διαφανές- - αντί να χρησιμοποιήσετε το
σύνοροΙδιότητα CSS marginheight-Αντίθετα, χρησιμοποιήστε το CSSπεριθώριοιδιοκτησίαmarginwidth-Αντίθετα, χρησιμοποιήστε το CSSπεριθώριοιδιοκτησία- -Αντίθετα, χρησιμοποιήστε το CSS
ξεχείλισμαιδιοκτησία
Υποστήριξη προγράμματος περιήγησης IFRAME
ο IFRAME Το στοιχείο αυτό υποστηρίζεται από όλα τα σύγχρονα προγράμματα περιήγησης:
- Android
- Χρώμιο
- Firefox
- Internet Explorer 2+
- iOS / Safari Mobile
- Netscape 7+
- Opera 3+
- Σαφάρι
Αν δεν εμφανίζεται κανένας αριθμός έκδοσης στην παραπάνω λίστα, αυτό συμβαίνει επειδή το υποστηρίζουν όλες οι εκδόσεις αυτού του προγράμματος περιήγησης.
Ένα πράγμα που πρέπει να προσέξουμε είναι ότι ενώ όλα τα προγράμματα περιήγησης υποστηρίζουν το IFRAME στοιχείο, εξακολουθεί να υπάρχει περιορισμένη υποστήριξη για ορισμένες από τις λειτουργίες HTML5.
- Χρησιμοποιώντας
ξεχείλισμαη απενεργοποίηση της κύλισης δεν είναι αξιόπιστη. Αν δεν θέλετε γραμμές κύλισης στα πλαίσια iframe, θα πρέπει να συνεχίσετε να χρησιμοποιείτε τοκύλισηΧαρακτηριστικό. - ο
srcdoc,sandbox, καιχωρίς ραφήτα χαρακτηριστικά δεν υποστηρίζονται από κανένα πρόγραμμα περιήγησης αυτή τη στιγμή.
Σύνδεση με τα εσωτερικά πλαίσια
Όταν δίνετε τα iframes σας a όνομα ή ταυτότητα τότε μπορείτε να τοποθετήσετε τους συνδέσμους σας σε αυτό το πλαίσιο με το χαρακτηριστικό στο ΕΝΑ στοιχείο. Στη συνέχεια, όταν ένας χρήστης κάνει κλικ στον σύνδεσμο, θα ανοίξει μέσα στο αναφερόμενο iframe παρά στο τρέχον παράθυρο.
Δοκιμάστε τον εαυτό σας. Πληκτρολογήστε τα ακόλουθα σε μια ιστοσελίδα:
Αυτό είναι το iframe μου
Όταν κάνετε κλικ σε αυτόν τον σύνδεσμο, θα ανοίξει ένα νέο έγγραφο μέσα στο παραπάνω παράθυρο.
id = "myIframe" src = "http://webdesign.about.com/#lp-main" ύψος = "200px" width = "500px">
Αν το έγγραφο άνοιξε στο IFRAME δεν έχει οριστεί στόχος, τότε όλες αυτές οι συνδέσεις θα ανοίξουν στο ίδιο iframe με το γονικό έγγραφο.
Μπορείτε να χρησιμοποιήσετε αυτή τη λειτουργία για να δημιουργήσετε συνδέσμους σε ένα IFRAME αλλάξτε τα περιεχόμενα ενός άλλου IFRAME Στην ιδια σελιδα.
IFrames και Ασφάλεια
ο IFRAME από μόνο του, δεν αποτελεί κίνδυνο για εσάς ή τους αναγνώστες σας. Δυστυχώς, τα iframes έχουν αποκτήσει κακή φήμη επειδή μπορούν να χρησιμοποιηθούν από κακόβουλους ιστότοπους για να συμπεριλάβουν περιεχόμενο που μπορεί να μολύνει τον υπολογιστή του επισκέπτη χωρίς να το δει στη σελίδα. Αυτό γίνεται με συνδέσμους που δείχνουν προς το αόρατο IFRAME και αυτά τα scripts απενεργοποιούν τον κακόβουλο κώδικα. Ο χρήστης κάνει κλικ στον σύνδεσμο και πιστεύει ότι ο σύνδεσμος είναι σπασμένος επειδή δεν φαίνεται να συμβεί τίποτα, αλλά ένα σενάριο είχε ξεκινήσει εκεί όπου δεν μπορούσαν να το δουν.
Υπάρχουν επίσης ιούς υπολογιστών που θα κάνουν έγχυση ένα αόρατο IFRAME στις ιστοσελίδες σας, μετατρέποντας αποτελεσματικά τον ιστότοπό σας σε ένα botnet. Μπορούν να το κάνουν αυτό μέσω της έγχυσης SQL και άλλων επιθέσεων.
Το πράγμα που πρέπει να θυμάστε όταν συμπεριλαμβάνετε ένα IFRAME στην ιστοσελίδα σας είναι ότι οι χρήστες σας είναι τόσο ασφαλείς όσο το περιεχόμενο όλων των ιστότοπων με τους οποίους συνδέεστε. Εάν έχετε λόγο να αισθανθείτε ότι ένας ιστότοπος είναι αναξιόπιστος, μην το συνδέετε με οποιονδήποτε τρόπο και σίγουρα δεν συμπεριλαμβάνετε τα περιεχόμενά του σε μια IFRAME. Ωστόσο, η σύνδεση με τις δικές σας σελίδες στα πλαίσια iframes δεν αποτελεί κίνδυνο για εσάς ή τους χρήστες σας.
Αρχικό άρθρο από την Jennifer Krynin. Επεξεργασμένο στις 11/7/16 από τον Jeremy Girard
