Εκπαιδευτικό Υδάτινο Κάστρο CSS (Ενότητα background-position-y)

προηγούμενη σελίδα background-position-x
Επόμενη σελίδα background-repeat

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

background-position-y Η ιδιότητα χρησιμοποιείται για να ρυθμίσει τη θέση της εικόνας φόντου στον άξονα y.

Συμβουλή:Προεπιλεγμένα, η εικόνα φόντου θα τοποθετηθεί στην αριστερή επάνω γωνία του στοιχείου και θα επαναληφθεί οριζόντια και κάθετα.

Παράδειγμα

Παράδειγμα 1

Πώς να τοποθετήσετε την εικόνα φόντου στον άξονα y;

div {
  background-image: url('w3css.gif');
  background-repeat: no-repeat;
  background-position-y: center;
}

Δοκιμάστε το شخصικά

Παράδειγμα 2

Πώς να τοποθετήσετε την εικόνα φόντου στην κορυφή;

body {
  background-image: url('w3css.gif');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position-y: bottom;
}

Δοκιμάστε το شخصικά

Παράδειγμα 3

Πώς να τοποθετήσετε την εικόνα φόντου στο άξονα y χρησιμοποιώντας ποσοστό:

body {
  background-image: url('w3css.gif');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position-y: 50%;
}

Δοκιμάστε το شخصικά

Παράδειγμα 4

Πώς να τοποθετήσετε την εικόνα φόντου στο άξονα y χρησιμοποιώντας pixel:

body {
  background-image: url('w3css.gif');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position-y: 80px;
}

Δοκιμάστε το شخصικά

Γλώσσα γραμματικής CSS

background-position-y: value;

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

Τιμή	Περιγραφή
top	Τοποθέτηση του φόντου στο πάνω μέρος του άξονα y.
bottom	Τοποθέτηση του φόντου στο κάτω μέρος του άξονα y.
center	Τοποθέτηση του φόντου στο κέντρο του άξονα y.
y%	Το πάνω μέρος του άξονα y είναι 0%, το κάτω μέρος είναι 100%. Το ποσοστό百分比值 αναφέρεται στην ύψος της περιοχής τοποθέτησης του φόντου μειωμένο από το ύψος της εικόνας φόντου.
ypos	Η απόσταση από το πάνω μέρος. Η μονάδα μπορεί να είναι pixel (π.χ. 0px) ή άλλες Εκπαιδευτικό Υδάτινο Κάστρο CSS (Μονάδες).
ypos offset	διυο-θεσμός γραμματικός, υποστηριζόμενος μόνο από Firefox και Safari. ypos Ορισμός ως top ή bottom. offset Είναι η οριζόντια απόσταση από το πάνω ή το κάτω μέρος της εικόνας φόντου από την ypos ορισμένη. Η μονάδα μπορεί να είναι pixel ή άλλες Εκπαιδευτικό Υδάτινο Κάστρο CSS (Μονάδες).
initial	Αποθήκευση αυτής της ιδιότητας στη προεπιλεγμένη της. Δείτε: initial.
inherit	Εκκαθάρισμα αυτής της ιδιότητας στο προεπιλεγμένο της. Δείτε: inherit.

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

Προεπιλεγμένη τιμή:	0%
Κληρονομικότητα:	Όχι
Δημιουργία αニματίας:	Υποστηρίζεται. Δείτε:Ιδιότητες σχετικές με την αニματία.
Έκδοση:	CSS3
Γλώσσα γραμματικής JavaScript:	object.style.backgroundPositionY="center"

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

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

	Chrome	Edge	Firefox	Safari	Opera
μονο-θεσμός γραμματικός	1.0	12.0	49.0	1.0	15.0
δι双υο-θεσμός γραμματικός	μη υποστηριζόμενο	μη υποστηριζόμενο	49.0	15.4	μη υποστηριζόμενο