Οι δυνατότητες της γλώσσας σήμανσης - HTML - και διαδοχικών φύλλων στυλ - CSS - σας επιτρέπουν να τοποθετήσετε μια εικόνα μέσα στην άλλη με πολλούς τρόπους. Φυσικά, αυτό απαιτεί κάποιες δεξιότητες στη διάταξη της ιστοσελίδας και πρέπει να επιλέξετε μια συγκεκριμένη μέθοδο με βάση τον υπάρχοντα κώδικα. Ωστόσο, σε ορισμένες περιπτώσεις, μπορείτε να το κάνετε χωρίς να επεξεργαστείτε τον πηγαίο κώδικα.
Οδηγίες
Βήμα 1
Υπάρχει ένας τρόπος να τοποθετήσετε μια εικόνα σε μια άλλη χωρίς αλλαγές στις σελίδες του ιστότοπου. Για να το κάνετε αυτό, αρκεί να επεξεργαστείτε την εικόνα φόντου που είναι αποθηκευμένη στο διακομιστή - χρησιμοποιήστε οποιοδήποτε πρόγραμμα επεξεργασίας γραφικών για να τοποθετήσετε την εικόνα προσκηνίου σε αυτό. Εάν αυτή η μέθοδος λειτουργεί για εσάς, ξεκινήστε καθορίζοντας τη θέση αποθήκευσης και το όνομα του αρχείου εικόνας φόντου. Αυτό μπορεί να γίνει αν το βρείτε στον πηγαίο κώδικα της σελίδας ή ανοίγοντας το σε ξεχωριστή καρτέλα και κοιτάζοντας την πλήρη διαδρομή στη γραμμή διευθύνσεων του προγράμματος περιήγησης.
Βήμα 2
Χρησιμοποιώντας τη διαχείριση αρχείων του συστήματος διαχείρισης περιεχομένου ή του προγράμματος-πελάτη FTP, πραγματοποιήστε λήψη του απαιτούμενου αρχείου στον υπολογιστή σας και ανοίξτε το σε οποιοδήποτε πρόγραμμα επεξεργασίας γραφικών - για παράδειγμα, στην εφαρμογή Paint που είναι εγκατεστημένη με Windows.
Βήμα 3
Τοποθετήστε την εικόνα προσκηνίου στο παρασκήνιο - στο Paint για αυτό πρέπει να επιλέξετε το στοιχείο "Εισαγωγή από" από την αναπτυσσόμενη λίστα "Εισαγωγή" στην καρτέλα "Αρχική σελίδα" και να βρείτε το απαιτούμενο αρχείο στο διάλογο που ανοίγει. Στη συνέχεια, προσαρμόστε τη θέση της εισαγόμενης εικόνας στο υπάρχον φόντο (σύρετέ την με το ποντίκι) και αποθηκεύστε το αποτέλεσμα (Ctrl + S).
Βήμα 4
Φορτώστε ξανά την επεξεργασμένη εικόνα, αντικαθιστώντας την παλιά. Αυτό ολοκληρώνει τη διαδικασία.
Βήμα 5
Η περιγραφείσα μέθοδος είναι άβολη στην περίπτωση που οι εισηγμένες εικόνες πρέπει να αλλάζουν κατά καιρούς. Στη συνέχεια, χρησιμοποιήστε τις δυνατότητες της γλώσσας HTML - για παράδειγμα, κάντε την εικόνα φόντου το φόντο του στοιχείου σελίδας στο οποίο θα τοποθετηθεί η εικόνα προσκηνίου. Ένα τέτοιο στοιχείο περιέκτη μπορεί να είναι, για παράδειγμα, ένα στρώμα (div). Για να δημιουργήσετε ένα μεγάλο μέρος των εικόνων ως φόντο, πρέπει να χρησιμοποιήσετε την περιγραφή στυλ - το χαρακτηριστικό στυλ της ετικέτας div. Ένα κενό κοντέινερ σε κώδικα HTML μπορεί να μοιάζει με αυτό:
Σε παρένθεση, υποδείξτε τη διεύθυνση και το όνομα του αρχείου εικόνας φόντου στον ιστότοπό σας.
Βήμα 6
Δημιουργήστε μια ετικέτα εικόνας προσκηνίου (img), χρησιμοποιώντας το ίδιο χαρακτηριστικό στυλ για να ορίσετε το μέγεθος της επένδυσης από τις άκρες του κοντέινερ φόντου. Για παράδειγμα:
Εδώ, τα χαρακτηριστικά πλάτους και ύψους καθορίζουν τις διαστάσεις της εικόνας και οι τέσσερις αριθμοί μετά την επένδυση υποδεικνύουν την επένδυση σε pixel από τις άκρες του δοχείου, ξεκινώντας από την κορυφή (50) και περαιτέρω δεξιόστροφα (60 - δεξιά, 70 - κάτω, 80 - αριστερά).
Βήμα 7
Τοποθετήστε την ετικέτα img σε ένα δοχείο:
Βήμα 8
Προσθέστε τις γραμμές που δημιουργήθηκαν στον πηγαίο κώδικα της σελίδας και, στη συνέχεια, αλλάζοντας τις εσοχές, προσαρμόστε τη θέση της εισαγόμενης εικόνας στο φόντο της εικόνας φόντου.
