Πώς να φτιάξετε έναν όμορφο σύνδεσμο

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

Πώς να φτιάξετε έναν όμορφο σύνδεσμο
Πώς να φτιάξετε έναν όμορφο σύνδεσμο

Βίντεο: Πώς να φτιάξετε έναν όμορφο σύνδεσμο

Βίντεο: Πώς να φτιάξετε έναν όμορφο σύνδεσμο
Βίντεο: Εδώ είναι ένα μυστικό - πώς να φτιάξετε το τέλειο κίτρινο μείγμα😍 2024, Νοέμβριος
Anonim

Οι σύνδεσμοι επηρεάζουν σημαντικά την εμφάνιση μιας ιστοσελίδας. Είτε πρόκειται για τον ιστότοπό σας ή το ιστολόγιό σας, οι όμορφα προσαρμοσμένοι σύνδεσμοι θα αλλάξουν το σχεδιασμό του ιστότοπού σας προς το καλύτερο. Ακόμα και χωρίς γνώση html και css, η δημιουργία ενός ωραίου συνδέσμου είναι πολύ εύκολη.

Πώς να φτιάξετε έναν όμορφο σύνδεσμο
Πώς να φτιάξετε έναν όμορφο σύνδεσμο

Οδηγίες

Βήμα 1

Πρώτα απ 'όλα, ας δημιουργήσουμε έναν κανονικό σύνδεσμο. Αυτό γίνεται χρησιμοποιώντας τον ακόλουθο κώδικα: όνομα συνδέσμου. Σε αυτόν τον κωδικό, η ετικέτα είναι ένας σύνδεσμος. Το χαρακτηριστικό "href" δείχνει τη διεύθυνση της σελίδας στην οποία οδηγεί ο σύνδεσμος. Αντί για "τίτλο συνδέσμου", γράψτε μια λέξη ή φράση που θα αντιπροσωπεύει τον σύνδεσμο

Μπορείτε επίσης να προσθέσετε κείμενο που θα εμφανίζεται όταν κάνετε κλικ στον σύνδεσμο. Το χαρακτηριστικό "title" της ετικέτας θα σας βοηθήσει με αυτό.

Βήμα 2

Τώρα ας πάμε στη σύνδεση. Ο ευκολότερος τρόπος για να το κάνετε αυτό είναι με κλιμακωτά φύλλα στυλ (css). Ανοίξτε το αρχείο που περιέχει τα στυλ για τον ιστότοπό σας και γράψτε περαιτέρω κώδικα εκεί. Εναλλακτικά, μπορείτε να εισαγάγετε στυλ απευθείας στη σελίδα html. Για να το κάνετε αυτό, χρησιμοποιήστε τον κωδικό προσαρμογής στυλ ιστοτόπου.

Βήμα 3

Ας πάμε στο σχέδιο. Η σύνταξη για την καταχώριση θα είναι {παραμέτρους στυλ}. Τι πρέπει να γράψω εδώ;

Αρχικά, αλλάξτε το χρώμα των συνδέσμων που σας αρέσουν. Αυτός ο κωδικός θα σας βοηθήσει με αυτό:

ένα {color: # 00000;}. Φυσικά, αντί για "# 00000" πρέπει να εισαγάγετε το δικό σας χρώμα. Μπορείτε να βρείτε τον κωδικό χρώματος σε αυτήν τη φόρμα σε διαφορετικά προγράμματα γραφικών (για παράδειγμα, στο Photoshop) ή να βρείτε μια παλέτα ιστού.

Βήμα 4

Από προεπιλογή, το πρόγραμμα περιήγησης υπογραμμίζει συνδέσμους. Αυτό μπορεί να ακυρωθεί με τον ακόλουθο κωδικό: a {text-decoration: none;}

Για να δημιουργήσετε έντονους συνδέσμους, χρησιμοποιήστε την παράμετρο font-weight: bold; Εισάγεται στον κώδικα στυλ με τον ίδιο τρόπο όπως το χρώμα, υπογραμμίζει.

Βήμα 5

Ίσως έχετε παρατηρήσει ότι σε ορισμένους ιστότοπους, όταν τοποθετείτε το δείκτη του ποντικιού πάνω από έναν σύνδεσμο, η εμφάνισή του αλλάζει. Μπορείτε να το κάνετε και αυτό. Ένας τέτοιος κώδικας θα σας βοηθήσει: α: αιωρήστε {παραμέτρους στυλ}. Οι παράμετροι καθορίζονται με τον ίδιο τρόπο όπως για έναν κανονικό σύνδεσμο, η μόνη τιμή είναι η ψευδο-κλάση "hover", η οποία ειδοποιεί το πρόγραμμα περιήγησης ότι αυτές οι ρυθμίσεις πρέπει να εφαρμόζονται κατά την αιωρηματοποίηση του συνδέσμου.

Παρομοίως, μπορείτε να επισημάνετε τους συνδέσμους που επισκέπτεστε: a: επισκέφθηκαν {παραμέτρους στυλ}

Συνιστάται: