Frames σε ιστοσελίδα HTML Μάθημα 8ο Frames σε ιστοσελίδα HTML
Ετικέτα Frameset Σε ένα έγγραφο HTML διευκολύνει και πολλές φορές είναι απαραίτητο να μπορούμε να χωρίζουμε την ιστοσελίδα μας σε διάφορα τμήματα. Αυτό επιτυγχάνεται με την ετικέτα <FRAMESET> … </FRAMESET> Attribute Value cols pixels % * rows H ετικέτα <FRAMESET> πάει μαζί με την ετικέτα <FRAME>…</FRAME> που καθορίζει τα περιεχόμενα της ιστοσελίδας.
Ετικέτα <FRAME> … </FRAME> Attribute Value Description frameborder 0 1 Not supported in HTML5. Specifies whether or not to display a border around a frame longdesc URL Not supported in HTML5. Specifies a page that contains a long description of the content of a frame marginheight pixels Not supported in HTML5. Specifies the top and bottom margins of a frame marginwidth Not supported in HTML5. Specifies the left and right margins of a frame name text Not supported in HTML5. Specifies the name of a frame noresize Not supported in HTML5. Specifies that a frame is not resizable scrolling yes no auto Not supported in HTML5. Specifies whether or not to display scrollbars in a frame src Not supported in HTML5. Specifies the URL of the document to show in a frame
ΣΗΜΕΙΩΣΗ : Όταν γράφουμε ένα έγγραφο με FRAMES τότε και μόνο τότε δε βάζουμε την ετικέτα <BODY> στο HTML έγγραφό μας.
Παραδείγματα : <HTML> <TITLE>ΙΣΤΟΣΕΛΙΔΑ ΜΕ FRAMES</TITLES> <FRAMESET COLS=“20%,80%”> <FRAME NAME=“MIKRO TMIMA” SRC=“HTTP://WWW.FACEBOOK.COM”> <FRAME NAME=“MEGALO TMIMA” SRC=HTTP://WWW.YOUTUBE.COM> </FRAMESET> </HTML>
Παρατηρούμε ότι : Με τη δήλωση Cols στην FRAMESET η ιστοσελίδα μου χωρίστηκε σε 2κάθετα τμήματα (αν ήθελα να τη χωρίσω σε οριζόντια τμήματα τότε θα χρησιμοποιούσα τη δήλωση ROWS). Δίνω όνομα στα διάφορα τμήματα της ιστοσελίδας μου χρησιμοποιώντας τη δήλωση NAME, έτσι μπορώ να αναφέρομαι σε αυτά όποτε χρειαστεί).
Παράδειγμα : ιστοσελίδα με μενού Δημιουργώ πρώτα το αρχείο που θα περιέχει τα FRAMES της ιστοσελίδας μου : <HTML> <TITLE>ΙΣΤΟΣΕΛΙΔΑ ΜΕ FRAMES</TITLE> <FRAMESET COLS="20%,80%"> <FRAME NAME="Menu" SRC="P1.HTML"> <FRAME NAME="Main" SRC="P2.HTML"> ></FRAMESET> </HTML>
2) Δημιουργώ το αρχείο που θα περιέχει το μενού και θα εμφανίζεται στο τμήμα “Menu”. (Έστω ότι το ονομάζω P1.HTML). <HTML> <TITLE>HTML 1</TITLE> <BODY> <H2>ΜΕΝΟΥ ΕΠΙΛΟΓΩΝ</H1> <hr> <br> <a href="http://appinventor.mit.edu/explore/" TARGET="kirio">1. Appinventor</a> <a href="http://eclass.sch.gr" TARGET="kirio">2. Eclass</a> </BODY> </HTML>
3) Δημιουργώ το αρχείο P2.HTML <TITLE>HTML 2</TITLE> <BODY> <H1>ΜΕΓΑΛΟ ΤΜΗΜΑ</H1> </BODY> </HTML>
ΔΡΑΣΤΗΡΙΟΤΗΤΑ Κάντε τα παραδείγματα από τις διαφάνειες. Δημιουργήστε έγγραφο Frames που θα χωρίζουν τη σελίδα σε 3 τμήματα οριζόντια. Δημιουργήστε έγγραφο Frames που θα χωρίζουν τη σελίδα σε 3 τμήματα κάθετα. Δοκιμάστε στη σελίδα του μενού να βάλετε ένα πίνακα ή μια λίστα στη θέση του μενού.