DevTulz Online

Δημιουργός CSS Box Shadow

Φόντο


Τι είναι το CSS Box Shadow;

Η ιδιότητα CSS box-shadow προσθέτει εφέ σκιάς γύρω από το πλαίσιο ενός στοιχείου. Οι σκιές μπορούν να μετατοπιστούν, να θολώσουν, να εξαπλωθούν, να χρωματιστούν και να οριστούν ως inset (εσωτερική σκιά). Πολλαπλές σκιές διαχωρισμένες με κόμμα μπορούν να στοιβαχτούν για πλούσια εφέ. Αυτός ο δημιουργός σας επιτρέπει να κατασκευάσετε οπτικά σύνθετες σκιές πολλαπλών επιπέδων και να αντιγράψετε το έτοιμο CSS στο πρόχειρο.

Πώς να χρησιμοποιήσετε τον Δημιουργό Box Shadow

  1. Ρυθμίστε τα ρυθμιστικά για Offset X/Y, Blur και Spread για να τοποθετήσετε και να διαμορφώσετε τη σκιά.

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

  3. Ενεργοποιήστε το 'Inset' για να δημιουργήσετε εσωτερική λάμψη ή εφέ πίεσης.

  4. Κάντε κλικ στο '+ Προσθήκη επιπέδου' για να στοιβάξετε πολλαπλές σκιές.

  5. Αντιγράψτε το παραγόμενο CSS και επικολλήστε το στο φύλλο στυλ σας.

Keywords: δημιουργός CSS box shadow, box-shadow CSS, εργαλείο σκιάς CSS, CSS drop shadow, εσωτερική σκιά, σκιά πολλαπλών επιπέδων, CSS shadow online