Атрибуты: Параметры переполнения блочного элемента.

  Для указания браузеру как отображать пользовательский контент элемента - блочного тега на Web-странице, если этот контент не входит в размеры, установленные для поля элемента этого тега, применяются атрибуты стилей для переполнения поля элемента тега.
  Отображение контента при переполнении поля элемента
  Атрибуты:
  
  • overflow - Устанавливает, как отображать контент при горизонтальном и(или)вертикальном переполнении поля.
  • overflow-x - Устанавливает, как отображать контент при горизонтальном переполнении поля.
  • overflow-y - Устанавливает, как отображать контент при вертикальном переполнении поля.

Формат:

  • overflow|overflow-x|overflow-y:
      visible
      |hidden
      |scroll
      |auto

Значения:

  • visible – Пользовательский контент должен быть отражен на Web-странице полностью, даже если он выйдет за соответствующую границу поля.
      Если пользовательский контент выйдет за границу поля, то он может наложиться на соседний этому полю контент.
      Нормальное состояние. Наследуется от элемента тега HTML (inherit на самом верхнем возможном уровне).
  •  hidden – Соответствующий размер поля на Web-странице не должен быть увеличен, а пользовательский контент не входящий в этот размер будет скрыт.
  •  scroll – В отображении поля с пользовательским контентом на Web-странице, обязательно должны присутствовать горизонтальная и вертикальная полосы скроллинга, не зависимо от того, входит или не входит пользовательский контент в соответствующий размер.
      Соответствующий размер поля на Web-странице не должен быть увеличен, но его контент можно посмотреть с помощью полосы скроллинга.
  •  auto – В отображении поля с пользовательским контентом на Web-странице, горизонтальная и(или) вертикальная полосы скроллинга должны присутствовать только при переполнении поля.
      Соответствующий размер поля на Web-странице не должен быть увеличен, но его контент можно посмотреть с помощью полосы скроллинга.
  Отображение текстового контента при горизонтальном переполнении поля элемента.
  Атрибуты:
  text-overflow - Устанавливает стиль разрыва текстового контента, который не помещается в строку поля элемента на Web-странице.
  Текст может не поместиться в строку из за того, что в нём не нашлось законного места "разрыва", а "разрывы" в иных местах не разрешены, или если это не разрывный текст.
  Атрибут text-overflow имеет смысл только если значение атрибута стиля overflow|overflow-x не visible для связанного элемента.
  Место разрыва текста, стиль которого задаёт атрибут text-overflow, зависит от направления визуализации этого текста.

Формат:

  • text-overflow:
      clip
      |ellipsis

Значения:

  • clip - Текст обрезается, и его просмотр можно продолжить скроллингом.
      Нормальное состояние. Наследуется от тега HTML (inherit на самом верхнем возможном уровне).
  • ellipsis - Текст обрезается, дополняется многоточием, а его просмотр невозможно продолжить даже скроллингом.
      Хотя линейка горизонтального скроллинга поля элемента может и появиться.
  Авто скроллинг в поле элемента.
  Атрибуты:
  scroll-behavior - Устанавливает плавность авто скроллинга в поле элемента.
  Авто скроллинг возникает при использовании соответствующих методов DOM интерфейсов, например - scroll, scrollBy, scrollTo.

Формат:

  • scroll-behavior:
      auto
      |smooth
      |initial
      |inherit
      |unset

Значения:

  • auto - Браузер сам определит плавность авто скроллинга.
  • smooth - Включает плавный авто скроллинг.
  • initial - Значение атрибута устанавливается в значение по умолчанию (мнгновенный авто скроллинг).
  • inherit - Значение атрибута наследуется от элемента "родительского" тега.
  •  unset – Значения атрибута приводятся к унаследованным значениям если таковые есть, в противном случае - к значениям по умолчанию.