CSS: εισάγετε εικόνα - έτσι λειτουργεί
Σε αυτή την πρακτική συμβουλή εξηγούμε πώς να εισάγουμε μια εικόνα χρησιμοποιώντας το CSS. Βασικά, οι εικόνες μπορούν να εισαχθούν εδώ μόνο με τη μορφή εικόνων φόντου. Ωστόσο, αυτό αρκεί.
Εισαγάγετε εικόνα στο CSS
Για παράδειγμα, εάν θέλετε να συμπεριλάβετε μια εικόνα στην κεφαλίδα χρησιμοποιώντας το CSS, όπως το λογότυπό σας, τότε δηλώστε τις ακόλουθες ιδιότητες κάτω από #header:
- "φόντο: url (image.webp) #FFFFFF;"
- Εδώ το "bild.webp" θεωρείται ως η διεύθυνση URL της εικόνας σας είτε σε σχέση με το αρχείο css είτε ως απόλυτη διεύθυνση στη μονάδα δίσκου.
- Με το χρώμα που δηλώνετε το χρώμα φόντου στον ιστότοπό σας.
- Η εικόνα μπορεί πλέον να τοποθετηθεί χρησιμοποιώντας μια ακριβή θέση, όπως: "φόντο-θέση: 100px 100px;" ή μέσω σχετικών πληροφοριών που προσδιορίζονται από την ακμή του παραθύρου όπως "θέση-φόντο: κάτω δεξιά".
- Για να μην επαναλαμβάνεται συνεχώς η εικόνα σας, μπορείτε να ορίσετε μια "μη-επανάληψη" κάτω από την ιδιότητα "background-repeat". Μοιάζει με αυτό: "background-repeat: no-repeat;".
- Με την ιδιότητα "προσάρτηση φόντου" καθορίζετε αν η εικόνα μετακινείται με κύλιση ή παραμένει σε σταθερό σημείο της σελίδας: "προσάρτηση φόντου: σταθερή".
- Οι ιδιότητες προσδιορίζονται στο αρχείο CSS χωρίς εισαγωγικά.
Στην επόμενη πρακτική συμβουλή, διαβάστε πώς να ενσωματώσετε ένα αρχείο CSS χρησιμοποιώντας HTML.