СSS Свойство object-position
Пример
Изменить размер изображения в соответствии с его содержимым и расположить изображение 5px слева и 10% сверху внутри поля содержимого:
img.a {
width: 200px;
height:
400px;
object-fit: none;
object-position: 5px 10%;
border: 5px solid red;
}
Редактор кода »
Определение и использование
Свойство object-position используется вместе с object-fit, чтобы указать, как <img> или <video> должны быть расположены с координатами x/y внутри его собственного окна содержимого.
| Значение по умолчанию: | 50% 50% |
|---|---|
| Унаследованный: | да |
| Анимируемый: | да Прочитайте о animatable Попробовать |
| Версия: | CSS3 |
| JavaScript синтаксис: | object.style.objectPosition="0 10%" Попробовать |
Поддержка браузеров
Числа в таблице указывают первую версию браузера, которая полностью поддерживает свойство.
| Свойство | |||||
|---|---|---|---|---|---|
| object-position | 31.0 | 16.0 | 36.0 | 10.0 | 19.0 |
CSS Синтаксис
object-fit: position|initial|inherit;
Значение свойств
| Значение | Описание |
|---|---|
| position | Задает положение изображения или видео в его поле содержимого. Первое значение определяет ось x, а второе значение определяет y-оси. Может быть строкой (слева, по центру или справа) или числом (в px или %). Допускаются отрицательные значения |
| initial | Устанавливает для этого свойства значение по умолчанию. Прочитайте о initial |
| inherit | Наследует это свойство от родительского элемента. Прочитайте о inherit |
Связанные страницы
CSS Учебник: CSS object-fit
CSS Справочник: CSS object-fit
HTML DOM Справочник: Свойство objectPosition
