• Как заработать на сайте
  • Как заработать в интернете
  • Инвестиции в интернете
  • Партнерские программы
  • Рейтинг парт. программ
  • SEO продвижение
  • Вопросы и ответы
  • Термины оптимизатора
  • HTML-уроки
  • Интернет
  • Мои услуги
  • Реклама на сайте
  • Обратная связь
Стоимость баннера за месяц: 30$ (подробности)
Главная → HTML уроки и советы → CSS → Свойство CSS overflow

Свойство CSS overflow

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


Синтаксис CSS overflow

overflow: value;

Где value может принимать значения:

  • visible - отображать все содержимое даже за пределами объекта
  • hidden - не выводить содержимое за пределами объекта (все что не влезает внутрь будет скрыто)
  • scroll - добалять полосу прокрутки (всегда)
  • auto - добавлять полосу прокрутки только при необходимости
  • inherit - унаследование от элемента родителя;

Пример №1. Использование overflow:visible

Ниже представлен код примера, который выводит содержимое (текст) даже за пределами объекта.

<html> <head> <style> .primer1{ width: 100px; height: 40px; border: 1px solid #000; overflow: visible; } </style> </head> <body> <div class="primer1">Пример №1 использования overflow:visible</div> </body> </html>


Вот как это выглядит на странице:

Пример №1 использования overflow:visible

Пример №2. Использование overflow:auto

Ниже представлен код примера, который выводит содержимое (текст) даже за пределами объекта.

<html> <head> <style> .primer2{ width: 120px; height: 50px; border: 1px solid #000; overflow: auto; } </style> </head> <body> <div class="primer2">Пример №2 использования overflow:auto</div> </body> </html>

Вот как это выглядит на странице:

Пример №2 использования overflow:auto


Читайте также:
• Как сделать треугольник через CSS
• Свойство display
• Свойство transform
• Все про CSS border
• Все про CSS background
• Все про CSS transition
• Свойство box-shadow
• Медиа запросы (@)

← Перейти в каталог CSS уроков

Основные разделы
  • Главная
  • Партнерские программы
  • Рейтинг партнерских программ
  • Статьи про SEO
  • Термины SEO
  • Описание бирж
  • HTML-уроки и советы
  • CSS-уроки
  • Биткоины
  • PHP-уроки
  • Бинарные опционы
  • Социальные сети
  • Обзоры систем
  • Все про CMS
  • Реклама в интернете
Важно
  • Продвижение сайта
  • Аудит внутренней оптимизации
  • Куплю Ваш сайт
  • Куплю Вашу подпись на форуме
  • Подписаться на рассылку
  • Реклама на сайте
  • Карта сайта
  • Обратная связь
© 2010-2023 - Zarabotat-Na-Sajte.ru