Заміщені елементи

Заміщений елемент у CSS – це елемент, чиє представлення лежить поза областю дії CSS; це зовнішні об'єкти, чиє представлення – незалежне від моделі форматування CSS.

Простіше кажучи, це елементи, на чий вміст не впливають стилі поточного документа. За допомогою CSS можна впливати на положення заміщеного елемента, але не на сам його вміст. Частина заміщених елементів, як то елементи <iframe>, може мати власні списки стилів, але вони не успадковують стилі батьківського документа.

Єдиний інший вплив, котрий CSS може мати на заміщений елемент – те, що є властивості, котрі підтримують контроль розташування вмісту елемента всередині його рамок. Більше дивіться в Контролі розташування об'єкта всередині рамок вмісту.

Заміщені елементи

Звичні заміщені елементи:

Частина елементів вважається заміщеними лише в певних випадках:

Крім цього, специфікація HTML стверджує, що елемент <input> може бути заміщеним, адже елементи <input> типу "image" – є заміщеними елементами, подібно до <img>. Проте інші контрольні елементи, в тому числі інші типи елементів <input>, явно перелічені як незаміщені елементи (специфікація описує їхню усталену платформозалежну візуалізацію терміном "віджети").

Об'єкти, додані за допомогою властивості content, є анонімними заміщеними елементами. Вони "анонімні" через те, що не існують в розмітці HTML.

Застосування CSS до заміщених елементів

CSS у деяких випадках обробляє заміщені елементи по-особливому, наприклад, при обчисленні зовнішніх відступів та частини значень auto.

Зверніть увагу, що частина заміщених елементів, але не всі, має природні розміри або визначену базову лінію, котрі використовуються певними властивостями CSS, як то vertical-align. Лише заміщені елементи можуть мати природні розміри.

Контроль положення об'єкта всередині рамок вмісту

Певні властивості CSS можуть застосовуватися для задання того, як об'єкт, вміщений всередині заміщеного елемента, повинен розташовуватися всередині прямокутника елемента. Вони описані специфікацією Зображень CSS:

object-fit

Задає те, як об'єкт вмісту заміщеного елемента повинен вписуватись в рамки контейнерного елемента.

object-position

Задає спосіб шикування об'єкта вмісту заміщеного елемента всередині його рамок.

Дивіться також

Помітили помилку на цій сторінці?

Переглянути сирці на GitHub.

Редагувати вміст на GitHub.

Почати обговорення на GitHub стосовно вмісту цієї сторінки.