Właściwość pozycji obiektu CSS
Przykład
Zmień rozmiar obrazu, aby zmieścił się w polu zawartości i umieść obraz 5 pikseli od lewej i 10% od góry w polu zawartości:
img.a {
width: 200px;
height:
400px;
object-fit: none;
object-position: 5px 10%;
border: 5px solid red;
}
Definicja i użycie
Właściwość object-position
jest używana razem z dopasowaniem do obiektu, aby określić, w jaki sposób <img> lub <video> powinny być umieszczone ze współrzędnymi x/y wewnątrz jego „własnego pola treści”.
Domyślna wartość: | 50% 50% |
---|---|
Dziedziczny: | tak |
Animowalny: | tak. Przeczytaj o animacji |
Wersja: | CSS3 |
Składnia JavaScript: | obiekt .style.objectPosition="0 10%" |
Obsługa przeglądarki
Liczby w tabeli określają pierwszą wersję przeglądarki, która w pełni obsługuje tę właściwość.
Property | |||||
---|---|---|---|---|---|
object-position | 31.0 | 16.0 | 36.0 | 10.0 | 19.0 |
Składnia CSS
object-position: position|initial|inherit;
Wartości nieruchomości
Value | Description |
---|---|
position | Specifies the position of the image or video inside its content box. First value controls the x-axis and the second value controls the y-axis. Can be a string (left, center or right), or a number (in px or %). Negative values are allowed |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Powiązane strony
Samouczek CSS: dopasowanie obiektów CSS
Odniesienie CSS: CSS obiektu-dopasowanie
Dokumentacja HTML DOM: Właściwość objectPosition