Question 1

Τι είναι η ιδιότητα text-shadow στην CSS;

Accepted Answer

Το text-shadow προσθέτει εφέ σκιάς στους χαρακτήρες του κειμένου. Κάθε σκιά ορίζεται από οριζόντια μετατόπιση, κάθετη μετατόπιση, προαιρετική ακτίνα θολώματος και χρώμα, και πολλές σκιές μπορούν να συνδυαστούν σε μία τιμή διαχωρισμένη με κόμματα για πλούσια εφέ.

Question 2

Πώς λειτουργούν οι πολλαπλές στρώσεις σκιάς;

Accepted Answer

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

Question 3

Τι σημαίνουν μετατόπιση X, μετατόπιση Y και θόλωση;

Accepted Answer

Η μετατόπιση X μετακινεί τη σκιά αριστερά ή δεξιά των χαρακτήρων, η μετατόπιση Y πάνω ή κάτω, και η ακτίνα θολώματος μαλακώνει τις ακμές: το 0 δίνει σκληρή ακμή όπως στα στυλ Ρετρό ή Περίγραμμα, μεγαλύτερες τιμές διαχέουν το χρώμα σαν λάμψη.

Question 4

Πώς φτιάχνω εφέ neon λάμψης;

Accepted Answer

Χρησιμοποιήστε την προεπιλογή Neon ή ρυθμίστε πολλές στρώσεις με μηδενική μετατόπιση, το ίδιο φωτεινό χρώμα και αυξανόμενες τιμές θολώματος, π.χ. 0 0 3px, 0 0 8px και 0 0 20px. Οι στοιβαγμένες άλωτες μιμούνται το φως ενός σωλήνα neon.

Question 5

Επηρεάζει το text-shadow την απόδοση σχεδίασης;

Accepted Answer

Λίγες στατικές στρώσεις κοστίζουν λίγο, αλλά κείμενο με πολλές έντονα θολές σκιές κοστίζει περισσότερο στην επανασχεδίαση. Βαριές σκιές σε μεγάλες παραγράφους ή συνεχές animation στο text-shadow μπορεί να προκαλέσει πτώση καρέ σε αδύναμες και κινητές συσκευές· προτιμήστε σύντομους τίτλους, μέτρια θόλωση ή κάντε animation στην αδιαφάνεια.

Question 6

Πώς κάνω τη σκιά ημιδιαφανή;

Accepted Answer

Κάθε στρώση έχει slider αδιαφάνειας που μετατρέπει το επιλεγμένο χρώμα σε μορφή rgba, π.χ. rgba(0, 0, 0, 0.5). Οι ημιδιαφανείς σκιές ενσωματώνονται φυσικά με οποιοδήποτε φόντο — έτσι η προεπιλογή Χαρτί πετυχαίνει μαλακή εμφάνιση εκτύπωσης ανάγλυφου.

Question 7

Ποια είναι η διαφορά text-shadow και box-shadow;

Accepted Answer

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

Question 8

Ποιοι browsers υποστηρίζουν το text-shadow;

Accepted Answer

Το text-shadow υποστηρίζεται από όλους τους σύγχρονους browsers, μεταξύ των οποίων Chrome, Firefox, Safari, Edge και Opera, και είναι σταθερό χωρίς προθέματα πάνω από μια δεκαετία. Οι σκιές πολλών στρώσεων λειτουργούν ίδια παντού.

Question 9

Αποστέλλεται σε server ό,τι πληκτρολογώ;

Accepted Answer

Όχι. Το κείμενο προεπισκόπησης και όλες οι στρώσεις που ρυθμίζετε μένουν στον browser σας και το CSS δημιουργείται τοπικά στη σελίδα. Τίποτα δεν αποστέλλεται μέσω δικτύου, ώστε το εργαλείο λειτουργεί και offline μετά τη φόρτωση.

Γεννήτρια Text Shadow CSS

Πώς να χρησιμοποιήσετε το Γεννήτρια Text Shadow CSS