el:school:lessons:html:ergastirio:askisi7b
HTML - Άσκηση 7c - Εικόνες - επεξεργασία με gimp
- Επανάληψη :
- Ετικέτες <IMG src=“”>
- Νέα :
- Ετικέτες <IMG align=“..”>
- Μείωση μεγέθους εικόνας με gimp
- Ανοίξτε την ιστοσελίδα askisi7b.html (ή αν δεν την έχετε, ανοίξτε την askisi5.html)
- Αποθηκεύστε στο X:/mathimata/html/ με όνομα askisi7c.html
- Αν δεν έχετε ήδη, δημιουργήστε έναν φάκελο eikones μέσα στον φάκελο που έχετε αποθηκεύσει την askisi7c.html.
- Μέσα στον φάκελο eikones δημιουργήστε νέο υποφάκελο maldives.
- Ψάξτε στο google (από τον σύνδεσμο εικόνες) για 2 εικόνες μεγάλου μεγέθους ( διαστάσεις πάνω από 640×480) από τις Μαλδίβες (συμβουλή χρησιμοποιήστε την λέξη στα αγγλικά δηλαδή maldives για περισσότερα αποτελέσματα) και αποθηκεύστε τις μέσα στον φάκελο maldives.
- Εμφανίζουμε τις εικόνες γράφοντας τον κώδικα που πρέπει στο αρχείο askisi7c.html (χωρίς την χρήση των παραμέτρων width και height)
- Ανοίξτε το πρόγραμμα επεξεργασίας εικόνας gimp
- Ανοίξτε την 1η εικόνα από τις Μαλδιβες μέσα από το gimp (συμβουλή : σύρετε τον φάκελο eikones από την πάνω μπάρα στο αριστερό πλαίσιο Τοποθεσίες για να κάνετε μια συντόμευση για τις επόμενες φορές)
- Gimp : Από το μενού Εικόνα/Μέγεθος εικόνας, αλλάζουμε το ύψος σε 240px και προσέχουμε το πλάτος (που θα αλλάξει αυτόματα αφού είναι κλειδωμένες οι αναλογίες) να είναι κάτω από 400px. Αλλιώς δοκιμάζουμε ύψος 200px.
- Σημειώνουμε το ύψος θα το χρειαστούμε στο όνομα αρχείου. ύψος : _ _ _ _ _ px, πλάτος _ _ _ _ _ px
- Τέλος πατάμε Κλίμακα για να γίνει η αλλαγή.
- Gimp : Από το μενού Αρχείο/Αποθήκευση ως αποθηκεύουμε προσθέτοντας στο τέλος του ονόματος _ (κάτω παύλα) και το ύψος x το πλάτος.
- Π.χ. εάν το όνομα της εικόνας ήταν maldives1.jpg και αλλάξαμε ύψος σε 240px και πλάτος σε 320px απόθηκεύουμε ως maldives1_240x320.jpg.
- Επαναλαμβάνουμε τα βήματα 6 έως 9 για την 2η εικόνα
- Εμφανίζουμε τις νέες εικόνες που δημιουργήσαμε, γράφοντας τον κώδικα που πρέπει στο αρχείο askisi7c.html (χωρίς την χρήση των παραμέτρων width και height)
- Από τον περιηγητή αρχείων πηγαίνουμε στον φάκελο που έχει τις εικόνες.
- (Συμπληρώνουμε δίπλα τα μεγέθη)
- Κάνουμε δεξί κλικ πάνω στις αρχικές εικόνες (πριν την επεξεργασία) και από τις ιδιότητες βρίσκουμε τα μεγέθη αρχείων. Αρχικό μέγεθος _ _ _ _ _ _ _ KB
- Ομοίως βρίσκουμε τα μεγέθη των εικόνων με τις μικρότερες διαστάσεις που δημιουργήσαμε : Τελικό μέγεθος _ _ _ _ _ _ _ KB
- ΣΤΟΙΧΙΣΗ ΕΙΚΟΝΑΣ
- Μεταφέρουμε την εικόνα σε ένα σημείο όπου να έχει αμέσως μετά κείμενο.
- Στοιχίζουμε την εικόνα αριστερά σε σχέση με το κείμενο
- Στοιχίζουμε την εικόνα δεξιά σε σχέση με το κείμενο
- Εξάσκηση : Κάντε τα βήματα 1-12 για εικόνες από την Χαβάη.
- Ανοίξτε την ιστοσελίδα askisi7a.html (ή αν δεν την έχετε την askisi6.html)
- Αποθηκεύστε στο X:/mathimata/html/ με όνομα askisi7d.html
- Συνεχίστε τα βήματα 3-13 όπως στην Άσκηση με τις Μαλδίβες
- Κάθε 1-2 γραμμές που πληκτρολογείτε, αποθηκεύετε με CTRL-S
- Για να δείτε το αποτέλεσμα ανοίξτε το αρχείο html από έναν περιηγητή (Firefox,IE) ή εάν το έχετε ήδη ανοίξει πατήστε F5 για επαναφόρτωση
- Εναλλαχθείτε στον περιηγητή και στον επεξεργαστή html με ALT-TAB
- Επαναλάβετε συχνά τα παραπάνω βήματα μέχρι το αποτέλεσμα στον περιηγητή να είναι όμοιο με την παρακάτω Εικόνα
el/school/lessons/html/ergastirio/askisi7b.txt · Last modified: by vagk
