Πώς να δημιουργήσετε ανατροπές στο Photoshop

Ένα κουμπί ανατροπής είναι ένα κουμπί στην ιστοσελίδα που αλλάζει κατάσταση όταν το ποντίκι περνάει από πάνω του . Η αλλαγή κατάστασης μπορεί να είναι οποιοσδήποτε αριθμός των αλλαγών , όπως το χρώμα , τη γραμματοσειρά , το μέγεθος ή ένα συνδυασμό αυτών . Κουμπιά Rollover προσθέσετε βερνίκι και τον επαγγελματισμό με την ιστοσελίδα σας και μπορεί εύκολα να δημιουργηθεί με το Adobe Photoshop και ImageReady . Αυτά τα βήματα λεπτομερώς πώς να δημιουργήσετε ένα απλό κουμπί ανατροπής , αλλά η διαδικασία μπορεί να αλλάξει για πιο στυλιζαρισμένη γραφικά . Τα πράγματα που θα χρειαστείτε
Adobe Photoshop
ImageReady
Η Εμφάνιση Περισσότερες οδηγίες
Δημιουργήστε το Button Εικόνες στο Photoshop
Η

1 Μεταβείτε στο μενού Αρχείο > Νέα και ρυθμίστε το μέγεθος εικόνας έως 80 από 25 pixels με ανάλυση 72 pixel ανά ίντσα . 2

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

Πατήστε το πλήκτρο " " Control + Backspace για να γεμίσει την περιοχή της εικόνας με το επιλεγμένο χρώμα φόντου σας .
Η 4

Επιλέξτε το "Τύπος " εργαλείο από την παλέτα εργαλείων , και να ρυθμίσετε το μέγεθος της γραμματοσειράς στο μενού εργαλείων πέρα από την κορυφή της οθόνης σας . Κάντε κλικ στην περιοχή του εγγράφου και πληκτρολογήστε το όνομα του κουμπιού , όπως " Portfolio" ή "Home ".
5

Χρησιμοποιήστε το "Move" εργαλείο για την ευθυγράμμιση του κειμένου με τις προτιμήσεις σας .

6

Αντιγράψτε τόσο το υπόβαθρο και το στρώμα τύπου . Δημιουργήστε ένα αντίγραφο από ένα στρώμα με δεξί κλικ πάνω σε ένα στρώμα στην παλέτα στρώματος και επιλέγοντας " Αντιγραφή ".
Η 7

Συγχώνευση των αρχικών φόντο και το κείμενο στρώματα κρατώντας πατημένο το πλήκτρο "Shift" ενώ κάνετε κλικ δύο στρωμάτων στην παλέτα στρωμάτων . Στη συνέχεια, πηγαίνετε στο Επεξεργασία > Συγχώνευση επιπέδων . Μετονομάστε το στρώμα " Normal κράτος . "
8

Κάντε διπλό κλικ στο "T" εικόνας προς τα αριστερά του αντιγράφονται στρώμα τύπου για να επισημάνετε το κείμενο . Κάντε κλικ στο δείγμα χρώματος από το μενού εργαλείων στο πάνω μέρος της οθόνης , και επιλέξτε ένα διαφορετικό χρώμα για το κείμενο όταν το ποντίκι πάνω από το κουμπί .
Η 9

Αλλάξτε το χρώμα στο επίπεδο φόντου , εάν επιθυμητό .
Η 10

Συγχώνευση των δύο αντιγραφεί στρώματα , και να μετονομάσετε το στρώμα " Rollover μέλος . " Το αρχείο σας θα πρέπει να περιέχει δύο στρώματα: το "Normal κράτος " στρώμα στο κάτω μέρος και το " Rollover μέλος " στρώμα στην κορυφή . Μπορείτε να δείτε πώς η αλλαγή του κουμπιού θα δούμε στρέφοντας την προβολή του το ανώτερο στρώμα και να σβήνουν . Κάντε κλικ στο γραφικό μάτι προς τα αριστερά του στρώματος για να εμφανίσετε ή να αποκρύψετε .
Εικόνων Δημιουργήστε το Button Rollover σε ImageReady
Η

11 Κάντε κλικ στο κουμπί " Μετάβαση σε ImageReady " . στο κάτω μέρος της παλέτας εργαλείων με το αρχείο το κουμπί σας είναι ακόμη ανοικτό
Η 12

Πηγαίνετε στην παλέτα εμφάνισης ( στο CS ή νεότερη έκδοση) ή την παλέτα ανατροπής ( σε παλαιότερες εκδόσεις ) ? αν δεν είναι ήδη ανοιχτή , πηγαίνετε στο μενού Window και επιλέξτε την παλέτα από το drop-down μενού
Η 13

Απόκρυψη της " Rollover μέλος " στρώμα ? . αυτό θα καθορίσει την κανονική κατάσταση του κουμπιού σας στο " Normal" στρώμα .
Η 14

Κάντε κλικ στο εικονίδιο " Δημιουργία νέου Κράτους" στο κάτω μέρος του "εμφάνιση" ή " Rollover " παλέτα . Ενεργοποιήστε την ορατότητα για το " Rollover μέλος " στρώμα για να την ορίσετε ως κρατική ανατροπής
Η 15

Πηγαίνετε στην παλέτα φέτα? . , Αν δεν είναι ήδη ανοιχτή , μπορεί να βρεθεί στο παράθυρο μενού . Αντιστοιχίστε ένα URL για να το κουμπί ανατροπής σας? Αυτή είναι η ιστοσελίδα , ο χρήστης θα πρέπει να ληφθούν για όταν κάνει κλικ στο κουμπί σας
Τετάρτη 16

Δοκιμάστε το κουμπί ανατροπής σας , κάνοντας κλικ στο "Προεπισκόπηση προεπιλεγμένο πρόγραμμα περιήγησης στο " κουμπί . κοντά στο κάτω μέρος της παλέτας εργαλείων .
Η 17

Πηγαίνετε στο File > Save Optimized να αποθηκεύσετε το αρχείο HTML και το φάκελο της εικόνας .
Η
εικόνων