TGViewer
CSS mind CSS mind @css_mind · 2.65K subscribers
Post #47 1.99K
Замещаемые элементы и где они обитают

Принято говорить, что замещаемые элементы - это те элементы, на отображение которых мы не можем влиять из css.

В спецификации html написано, что:

"Следующие элементы могут быть замещаемыми: audio, canvas, embed, iframe, img, input, object, и video."

В спецификации css чуть более развернуто:

"Элемент, содержимое которого выходит за рамки модели форматирования CSS, например изображение или iframe. Так, содержимое img заменяется изображением, которое обозначает его атрибут src."

Замещаемые элементы имеют собственные размеры (natural dimensions). Например, растровое изображение имеет собственную ширину и собственную высоту, указанные в абсолютных единицах (из которых, очевидно, можно определить собственное соотношение (ratio)).

Также, замещаемый элемент может и не иметь одного или нескольких, или всех собственных размеров.

Объекты, добавляемые с помощью CSS-свойства content являются анонимными замещаемыми элементами.
Анонимным в css называется то, к чему нельзя напрямую обратится.

Важно знать, что элемент замещаемый и какие именно собственные размеры у него есть, чтобы понять, как он будет отображаться. В разделе про расчёт ширины и отступов, который я постепенно перевожу (см. предыдущие посты), замещаемые элементы рассматриваются отдельно.

Версия поста в блоге.

#css_display
More from @css_mind
  1. Aug 27, 2026Говорят верстать легко, а мне вот сегодня калькулятор с регрессиией понадобился P.S. Кстат…
  2. Jul 14, 2026Кстати если у вас разные конфиги для разных директорий (например у меня для работы один юз…
  3. Jul 9, 2026Просто напоминаю, что существует сайт на старомонгольском. У него уникальный режим письма:…
  4. May 18, 2026А вы знали, что next ломает вам типизацию перменных? Если вы напишите ... @property --var…
  5. May 12, 2026И еще сегодня очередной день рождения CSS2 🥳🎂 28 годиков. Старше меня!
  6. May 12, 2026Между прочим interpolate-size завезли в хром аж полгода назад. Смотрите что мы теперь може…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →