Τρόπος κύλισης

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

Τρόπος κύλισης
Τρόπος κύλισης

Βίντεο: Τρόπος κύλισης

Βίντεο: Τρόπος κύλισης
Βίντεο: ΣΥΣΤΗΜΑΤΑ ΚΥΛΙΣΗΣ 2024, Ενδέχεται
Anonim

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

Τρόπος κύλισης
Τρόπος κύλισης

Οδηγίες

Βήμα 1

Επιλέξτε τη σελίδα για επεξεργασία και αντιγραφή του κώδικα HTML στο σημειωματάριο.

Μετά την ετικέτα, επικολλήστε τον κωδικό:

body {scrollbar-face-color: # 5997CA;

scrollbar-shadow-color: #ffffff;

scrollbar-highlight-color: #ffffff;

γραμμή κύλισης-3dlight-color: # 5997CA;

γραμμή κύλισης-darkshadow-color: # 5997CA;

scrollbar-track-color: # F6F6F6;

γραμμή κύλισης-βέλος-χρώμα: # F6F6F6; }

Βήμα 2

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

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

Βήμα 3

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

Συνιστάται: