Πώς να εισαγάγετε μια εικόνα σε έναν σύνδεσμο

Πίνακας περιεχομένων:

Πώς να εισαγάγετε μια εικόνα σε έναν σύνδεσμο
Πώς να εισαγάγετε μια εικόνα σε έναν σύνδεσμο

Βίντεο: Πώς να εισαγάγετε μια εικόνα σε έναν σύνδεσμο

Βίντεο: Πώς να εισαγάγετε μια εικόνα σε έναν σύνδεσμο
Βίντεο: Macrame BAG, στο χέρι, στη ζώνη. ΕΥΚΟΛΟ ΚΑΙ ΓΡΗΓΟΡΟ 2024, Ενδέχεται
Anonim

Η σύνταξη της γλώσσας HTML σάς επιτρέπει να δημιουργείτε υπερσυνδέσμους όχι μόνο με κείμενο, αλλά και με γραφικά. Για έναν επισκέπτη ιστότοπου, ένας τέτοιος σύνδεσμος μοιάζει με εικόνα και όταν κάνετε κλικ στην εικόνα, μεταβαίνετε σε άλλη ιστοσελίδα.

Πώς να εισαγάγετε μια εικόνα σε έναν σύνδεσμο
Πώς να εισαγάγετε μια εικόνα σε έναν σύνδεσμο

Οδηγίες

Βήμα 1

Χρησιμοποιώντας οποιοδήποτε πρόγραμμα επεξεργασίας γραφικών, μειώστε την εικόνα. Το μέγεθός του σε οποιαδήποτε από τις συντεταγμένες δεν πρέπει να υπερβαίνει τα 200 pixel. Είναι καλύτερο εάν η εικόνα έχει οριζόντια διάταξη. Αυτό μπορεί να είναι, για παράδειγμα, ένα εικονικό κουμπί, η επιγραφή στην οποία έχει δημιουργηθεί με καλλιτεχνική γραμματοσειρά. Η μορφή εικόνας πρέπει να είναι μία από τις ακόλουθες: JPG, PNG, GIF. Το πρώτο προτιμάται για φωτογραφίες και τα υπόλοιπα δύο προτιμώνται για γραμμικό σχέδιο (αυτή είναι η καλύτερη συμπίεση). Φροντίστε να αποθηκεύσετε το αποτέλεσμα της αλλαγής με νέο όνομα, ώστε να μην χαλάσετε το πρωτότυπο.

Βήμα 2

Ανεβάστε το αρχείο εικόνας στο διακομιστή στο φάκελο όπου βρίσκεται το αρχείο HTML. Για να πραγματοποιήσετε μια τέτοια λήψη, μπορείτε να χρησιμοποιήσετε τη διεπαφή ιστού (εάν διατίθεται από τον πάροχο φιλοξενίας) ή οποιοδήποτε πρόγραμμα πελάτη FTP.

Βήμα 3

Τοποθετήστε το ακόλουθο απόσπασμα κώδικα στην επιθυμητή θέση στο αρχείο HTML:, όπου η έκφραση μετά τον τελεστή "href =" είναι η διεύθυνση στην οποία οδηγεί ο σύνδεσμος και το someimage

Βήμα 4

Για ορισμένους χρήστες, η εμφάνιση εικόνων στο πρόγραμμα περιήγησης είναι απενεργοποιημένη. Ως εκ τούτου, συνιστάται να τοποθετήσετε μια εξήγηση για το πού οδηγεί ο σύνδεσμος ακριβώς κάτω από την εικόνα. Σε αυτήν την περίπτωση, τροποποιήστε το παραπάνω απόσπασμα κώδικα ώστε να μοιάζει με αυτό:

Κινηματογράφηση σε πρώτο πλάνο εντόμων. Επεξηγηματικό κείμενο θα εμφανιστεί κάτω από την εικόνα. Κάνοντας κλικ σε αυτό θα μεταφερθείτε επίσης στον σύνδεσμο.

Βήμα 5

Αφού ανεβάσετε την ενημερωμένη έκδοση του αρχείου HTML στο διακομιστή, ανοίξτε την αντίστοιχη σελίδα στο πρόγραμμα περιήγησης και, στη συνέχεια, βεβαιωθείτε ότι η εικόνα εμφανίζεται και ο σύνδεσμος είναι έγκυρος. Η μετάβαση κατά μήκος αυτής θα πρέπει να πραγματοποιηθεί όταν κάνετε κλικ τόσο στην εικόνα όσο και στην επεξηγηματική επιγραφή που βρίσκεται κάτω από αυτήν (εάν υπάρχει).

Συνιστάται: