Αναδυόμενα παράθυρα ή αναδυόμενα παράθυρα γίνονται όλο και πιο δημοφιλή στο Διαδίκτυο. Ή, πιο απλά, αναδυόμενες εικόνες. Πολλοί κάτοχοι ιστότοπων πρέπει συχνά να τους κάνουν για διαφημιστικούς σκοπούς, αλλά δεν γνωρίζουν όλοι τον αλγόριθμο για τη δημιουργία τους.
Είναι απαραίτητο
- - Πρόγραμμα επεξεργασίας HTML.
- - σημειωματάριο;
- - φιλοξενία.
Οδηγίες
Βήμα 1
Δημιουργήστε ή ανοίξτε μια νέα ιστοσελίδα σε HTML ή ένα πρόγραμμα επεξεργασίας κειμένου. Μπορείτε να χρησιμοποιήσετε δημοφιλή προγράμματα όπως το Dreamweaver, το Expression Web και άλλα για το σκοπό αυτό. Εάν κάνετε τα πρώτα σας βήματα στη γλώσσα προγραμματισμού HTML, χρησιμοποιήστε ένα κανονικό "σημειωματάριο".
Βήμα 2
Επικολλήστε τον ακόλουθο κώδικα μεταξύ των ετικετών "head" και "/ head":
.thumbnail {θέση: σχετικός; ευρετήριο z: 0;}
.thumbnail: αιωρήστε το {φόντο-χρώμα: διαφανές. ευρετήριο z: 50;}
.thumbnail span {/ * CSS για μεγεθυμένη εικόνα * / θέση: απόλυτη; χρώμα φόντου: ανοιχτόχρωμο επένδυση: 5px; αριστερά: -1000 εικονοστοιχεία; περίγραμμα: 1px διακεκομμένο γκρι. ορατότητα: κρυφό; χρωμα μαυρο; διακόσμηση κειμένου: κανένα;}
.thumbnail span img {/ * CSS για μεγέθυνση εικόνας / πλάτος περιγράμματος: 0; επένδυση: 2px;}
.thumbnail: hover span {/ * CSS για μεγεθυμένη εικόνα στο hover * / ορατότητα: ορατό. κορυφή: 0; αριστερά: 65 εικονοστοιχεία; / * θέση όπου η μεγεθυμένη εικόνα πρέπει να αντισταθμίζεται οριζόντια * /}
Βήμα 3
Προσαρμόστε την οριζόντια μετατόπιση της αναδυόμενης εικόνας αλλάζοντας την τιμή στην τελευταία γραμμή κώδικα. Κατανομή χώρου μεταξύ των ετικετών "body" και "/ body" όπου θέλετε να εμφανίζεται η εικόνα στην ιστοσελίδα. Στη συνέχεια, αντιγράψτε και επικολλήστε τον ακόλουθο κώδικα:
Παράδειγμα τίτλου κειμένου
Ένα παράδειγμα τίτλου κειμένου"
Βήμα 4
Αντικαταστήστε το φάκελο " Κάντε το ίδιο με το δεύτερο μπλοκ κώδικα. Αλλάξτε τη γραμμή "Παράδειγμα τίτλου κειμένου" σε αυτό που πρέπει να γραφτεί στην αναδυόμενη εικόνα. Αλλάξτε επίσης τις τιμές ύψους και πλάτους στον κώδικα για να προσαρμόσετε το μέγεθος της αναδυόμενης εικόνας. Δημιουργήστε επιπλέον τμήματα κώδικα για να προσθέσετε περισσότερα σκίτσα. Εισαγάγετε άλλα χαρακτηριστικά, ετικέτες και κείμενο στο έγγραφο HTML, όπως απαιτείται. Αποθηκεύστε το αρχείο HTML και, στη συνέχεια, ανεβάστε το στο διακομιστή ιστού σας.
