Προσθήκη εφέ σκιάς σε εικόνες με την αυτόματη δημιουργία κώδικα CSS3

Το CSS σάς επιτρέπει να σχεδιάζετε τις ιστοσελίδες σας εύκολα, πολύ εύκολα. Μπορείτε να ορίσετε πάνω από εκατό στυλ κειμένου σε μία σελίδα (φυσικά η σελίδα σας θα βγει σαν μια τέντα τσίρκου), αλλά αφορά την ευκολία και την ευελιξία που συνοδεύει τη χρήση CSS σε ιστοσελίδες.Θεματικό σοκ έχει μια γεννήτρια κωδικοποιητή CSS που θα σας βοηθήσει να προσθέσετε διαφορετικά εφέ πτώσης στις εικόνες σας με λίγα απλά κλικ. Επιλέγετε το εφέ και γράφει τον κώδικα. εφέ μπορούν να προστεθούν στο κάτω μέρος, πλευρές, πάνω & κάτω, κάτω αριστερά, κάτω δεξιά, πάνω δεξιά και κάτω αριστερά ή σε διαγώνιες γωνίες.

Πριν ξεκινήσεις; ελέγξτε τη διάσταση της εικόνας σας (στην οποία θέλετε να προσθέσετε το εφέ). Η γεννήτρια κώδικα έχει ένα προκαθορισμένο άνω και κάτω όριο 130 - 347 εικονοστοιχείων για το πλάτος και το ύψος της εικόνας. Εάν οι διαστάσεις της εικόνας σας υπερβαίνουν αυτό, μπορείτε πάντα να επεξεργαστείτε το πλάτος και το ύψος αργότερα. Ο κωδικός σάς επιτρέπει επίσης να προσδιορίσετε την αδιαφάνεια και το θάμπωμα της σκιάς. Δεν μπορείτε να ανεβάσετε την εικόνα σας στη δημιουργία κώδικα, θα χρησιμοποιηθεί μια προεπιλεγμένη εικόνα, ώστε να μπορείτε να κάνετε προεπισκόπηση του εφέ.

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

Μόλις ρυθμιστούν όλα, αντιγράψτε τον κώδικα CSS σε ένα αρχείο CSS και ονομάστε τον για την ιστοσελίδα σας (ή το θέμα). Δημιουργείται επίσης ο κώδικας HTML που περιλαμβάνεται στην ιστοσελίδα σας (είναι μοναδικός για κάθε εφέ που επιλέγετε από το αναπτυσσόμενο μενού), αντιγράψτε τον και τοποθετήστε τον κωδικό εικόνας (img src = "") όπου λέει "ο κωδικός σας εδώ'.

Το καλύτερο πράγμα για αυτήν τη δημιουργία κώδικα είναι ότι λειτουργεί και είναι δωρεάν. Έχει περιορισμούς διαστάσεων για εικόνες, αλλά μπορούν να επεξεργαστούν από τον κώδικα. Εάν χρησιμοποιείτε μια διαφανή εικόνα (όπως αυτή παραπάνω), θα δώσει ένα θαμπό γκρι φόντο. Μπορείτε να επεξεργαστείτε το χρώμα φόντου αργότερα από τον κώδικα. (Επεξεργασία φόντου γραμμής κώδικα: #ccc). Ο κώδικας δίνει επίσης καρέ 5 εικονοστοιχείων σε όλες τις εικόνες, μπορείτε επίσης να επεξεργαστείτε το καρέ, αλλά η αύξηση και η μείωση του πλάτους θα κρύβουν ή θα αποκαλύψουν τη σκιά περισσότερο από ό, τι είναι απαραίτητο, οπότε πρέπει να μείνετε μόνοι σας.

Επισκεφτείτε το ThemeShock CSS Drop Shadow Generator