Εκπαιδευτικός Οδηγός Ιδιότητας background-image CSS

Ορισμός και χρήση

background-image Η ιδιότητα ρυθμίζει την εικόνα φόντου για το στοιχείο.

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

Προεπιλεγμένα, η εικόνα φόντου βρίσκεται στο πάνω αριστερό μέρος του στοιχείου και επαναλαμβάνεται水平和 οριζόντια.

Συμβουλή:Προτείνουμε να ρυθμίσετε μια διαθέσιμη χρώση φόντου, ώστε η σελίδα να έχει καλή αισθητική και αν η εικόνα φόντου δεν είναι διαθέσιμη.

Λεπτομερείς πληροφορίες

Η ιδιότητα background-image ρυθμίζει μια εικόνα στο φόντο του στοιχείου.

Βασίζεται στο background-repeat τιμή της ιδιότητας, η εικόνα μπορεί να επαναληφθεί άπειρα, να επαναληφθεί κατά μήκος μιας άξονα (x άξονα ή y άξονα) ή να μην επαναληφθεί καθόλου.

Η αρχική εικόνα φόντου (η αρχική εικόνα) βασίζεται στο background-position Τοποθέτηση τιμής της ιδιότητας.

Δείτε επίσης:

Εκμάθηση CSS:CSS Background、Φόντο CSS (προχωρημένο)、CSS Gradient

Εγχειρίδιο αναφοράς HTML DOM:Ιδιότητα backgroundImage

Παράδειγμα

Όρισε την εικόνα ως φόντο της σελίδας:

body
  { 
  background-image: url(bgimage.gif);
  background-color: #000000;
  }

Προσπάθησε να το δοκιμάσεις!

Γλωσσική δομή του CSS

background-image: url|μηδέν|initial|inherit;

Τιμή ιδιότητας

Τιμή ιδιότητας

Τιμή Περιγραφή
url('URL') Διαδρομή προς την εικόνα.
μηδέν Προεπιλεγμένη τιμή. Δεν εμφανίζεται η εικόνα φόντου.
inherit Καθορίζεται ότι η ρύθμιση της ιδιότητας background-image πρέπει να προέρχεται από το γονικό στοιχείο.

Τεχνικά λεπτομέρειες

Προεπιλεγμένη τιμή: μηδέν
Αντιληπσιμότητα: όχι
Έκδοση: CSS1
Γλωσσική δομή του JavaScript: object.style.backgroundImage="url(stars.gif)"

Υποστήριξη του προγράμματος περιήγησης

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

Χρωμόστυλο Κόμβος Φάιρφξεξ Σαφάρι Οπερα
Χρωμόστυλο IE / Κόμβος Φάιρφξεξ Σαφάρι Οπερα
1.0 4.0 1.0 1.0 3.5