English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Руководство по CSS

Правила CSS (RULES)

Полный список свойств CSS

Метод использования и примеры для свойства overflow-x в CSS3

Свойство overflow-x CSS определяет, что делать с содержимым, которое выходит за правые и левые края области контента элемента: обрезать его, показывать полосы прокрутки или показывать содержимое.

Таблица ниже предоставляет инструкции по использованию и историю версий этого свойства, а также синтаксис использования свойства в скриптах JavaScript.

Значение по умолчанию:visible
Поддерживается:Block, inline-block и flex контейнеры
Наследование:Нет
Анимировано:Нет.Пожалуйста, смотрите: Анимационные свойства.
Версия: Новая функция CSS3
JavaScript грамматика:object.style.overflowX="scroll"

Грамматика использования overflow-x

Грамматика этого свойства такая:

overflow-x:　visible　|　hidden　|　scroll　|　auto　|　initial　|　inherit

Ниже приведен пример того, как использовать свойство overflow-x.

　　div　{
　　　width:　400px;
　　　height:　300px;
　　　overflow-x:　scroll;
　　}
Проверьте,›/›

Значение свойства

В таблице ниже описаны значения этого свойства.

ЗначениеОписание
visibleСодержимое не обрезается; он будет рендериться за пределами рамки элемента, поэтому может перекрываться другим содержимым. Это значение по умолчанию.
hiddenСодержимое переполненного элемента рамки будет обрезано, и оставшееся содержимое будет невидимо.
scrollПереполненное содержимое как бы скрыто, но предоставляется механизм прокрутки для доступа к переполненному содержимому.
autoЕсли содержимое выходит за пределы рамки элемента, он предоставляет ползунок для просмотра оставшегося содержимого.
initialУстановить этот атрибут в его значение по умолчанию.
inheritЕсли задан, то связанный элемент принимает значение свойства overflow-x родительского элемента.

Совместимость браузеров

Совместимость браузеров для overflow-x свойства, числа в таблице ниже представляют собой минимальную версию браузера, поддерживающего это свойство; все основные браузеры поддерживают это свойство.

  • Firefox 1.5 и выше

  • Google Chrome 1+

  • Internet Explorer 9+

  • Apple Safari 3+

  • Opera 9.5+

Предупреждение: Internet Explorer 7 и более ранние версии не поддерживают этот overflow-x свойство. IE8 поддерживает это свойство, но требует специфического для Microsoft:
-ms-префикс (например, -ms-overflow-x). Поддерживается в IE9 и более поздних версиях.

Дополнительное чтение

Пожалуйста, обратитесь к следующим учебникам:CSS Overflow.

Соответствующие свойства:overflow,overflow-y,clip,word-wrap.

Свойство overflow-y в CSS3CSS свойство overflow