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

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

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

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

Βίντεο: Πώς να φτιάξετε ένα φόντο συνδέσμου
Βίντεο: Πως να Φτιάξω Background για βιντεο - Ιδέες για Φόντο για βιντεο στο YouTube - Make Video Greece 2024, Νοέμβριος
Anonim

Από την εφεύρεση της γλώσσας σήμανσης υπερκειμένου, HTML, οι έννοιες της διάταξης και της διάταξης των εγγράφων ιστού έχουν αλλάξει δραματικά. Με την σχεδόν ολοκληρωμένη υποστήριξη δημοφιλών προγραμμάτων περιήγησης για τα πρότυπα φύλλων στυλ CSS και CSS2, κατέστη δυνατό να επηρεαστεί σχεδόν κάθε πτυχή της οπτικής παρουσίασης ενός εγγράφου. Για παράδειγμα, μπορείτε να κάνετε το φόντο ενός συνδέσμου έγχρωμο, γεμάτο με κάποια εικόνα και επίσης να αλλάξετε ανάλογα με τις ενέργειες του χρήστη.

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

Απαραίτητη

  • - τη δυνατότητα επεξεργασίας του κειμένου του εγγράφου ή του κειμένου των φύλλων στυλ εγγράφου ·
  • - ένα πρόγραμμα επεξεργασίας κειμένου που σας επιτρέπει να αποθηκεύσετε το έγγραφο στην αρχική κωδικοποίηση.

Οδηγίες

Βήμα 1

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

κείμενο συνδέσμου

Βήμα 2

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

Για παράδειγμα, για να ορίσετε ένα πράσινο φόντο για έναν συγκεκριμένο σύνδεσμο σε ένα έγγραφο, μπορείτε να προσθέσετε ένα σύνολο κανόνων στο φύλλο στυλ:

Ένα # ID_GREEN

{

χρώμα φόντου: # 00FF00;

}

Θα πρέπει επίσης να ορίσετε το χαρακτηριστικό ID του στοιχείου A που αντιστοιχεί στον επιθυμητό σύνδεσμο προς ID_GREEN:

κείμενο συνδέσμου

Βήμα 3

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

κείμενο συνδέσμου

Εάν είναι απαραίτητο, προσθέστε μια ιδιότητα επανάληψης φόντου στους κανόνες CSS που ορίζονται για να ορίσετε επιλογές για την αναπαραγωγή της εικόνας φόντου οριζόντια και κάθετα.

Βήμα 4

Κάντε το φόντο του συνδέσμου να αλλάζει όταν τοποθετείτε το δείκτη του ποντικιού πάνω του ή όταν κινείται η εστίαση. Προσθήκη συνόλων κανόνων σε ένα εξωτερικό ή ενσωματωμένο φύλλο στυλ εγγράφου που καθορίζει το φόντο ενός συνδέσμου ή ομάδας συνδέσμων σε διαφορετικές καταστάσεις. Χρησιμοποιήστε τους επιλογείς ID και χαρακτηριστικών σε συνδυασμό με τις δυναμικές ψευδο-τάξεις: hover,: active και: focus. Για παράδειγμα, προκειμένου το φόντο ενός συνδέσμου με μια τιμή χαρακτηριστικού ID του ID_DYNAMIC_BACKGROUND να είναι κόκκινο στην ανενεργή κατάσταση και πράσινο στην κατάσταση που βρίσκεται κάτω από τον κέρσορα του ποντικιού, πρέπει να προστεθούν τα ακόλουθα σύνολα κανόνων στο φύλλο στυλ:

Ένα # ID_DYNAMIC_BACKGROUND

{

χρώμα φόντου: # FF0000;

}

Ένα # ID_DYNAMIC_BACKGROUND: αιωρείται

{

χρώμα φόντου: # 00FF00;

}

Μπορείτε να κάνετε το ίδιο για να δημιουργήσετε ένα φόντο με μια δυναμικά μεταβαλλόμενη εικόνα.

Συνιστάται: