• Как продвинуть сайт на первые места?
    Вы создали или только планируете создать свой сайт, но не знаете, как продвигать? Продвижение сайта – это не просто процесс, а целый комплекс мероприятий, направленных на увеличение его посещаемости и повышение его позиций в поисковых системах.
    Ускорение продвижения
    Если вам трудно попасть на первые места в поиске самостоятельно, попробуйте технологию Буст, она ускоряет продвижение в десятки раз, а первые результаты появляются уже в течение первых 7 дней. Если ни один запрос у вас не продвинется в Топ10 за месяц, то в SeoHammer за бустер вернут деньги.
    Начать продвижение сайта
  • Сервис онлайн-записи на собственном Telegram-боте
    Тот, кто работает в сфере услуг, знает — без ведения записи клиентов никуда. Мало того, что нужно видеть свое расписание, но и напоминать клиентам о визитах тоже. Нашли самый бюджетный и оптимальный вариант: сервис VisitTime.
    Для новых пользователей первый месяц бесплатно.
    Чат-бот для мастеров и специалистов, который упрощает ведение записей:
    Сам записывает клиентов и напоминает им о визите;
    Персонализирует скидки, чаевые, кэшбэк и предоплаты;
    Увеличивает доходимость и помогает больше зарабатывать;
    Начать пользоваться сервисом
УРОКИ CSS CSS3 ПРИМЕРЫ CSS СПРАВОЧНИК CSS

CSS Урок 15 Отступы


« Назад Далее »

CSS свойства отступов (padding) определяют пространство между границей элемента и содержимым элемента.


Отступы

Оступы создают пространство вокруг содержания (внутри границы) элемента. На отступы влияет цвет фона элемента.

Верхний (top), правый (right), нижний (bottom) и левый (left) отступы могут быть заданы независимо, используя отдельные свойства. Стенографическое свойство также может использоваться, чтобы задать все отступы одновременно.

Возможные Значения

Значение Описание
длина Определяет фиксированный отступ (в пикселях, пунктах, единицах em, и т.д.)
% Определяет отступ в % от элемента-контейнера


Отступы - Индивидуальные значения для сторон

В CSS можно указать различные отступы для разных сторон:

Пример

padding-top:25px;
padding-bottom:25px;
padding-right:50px;
padding-left:50px;

Попробуйте сами »
Щелкните на кнопке "Попробуйте сами" чтобы увидеть как это работает


Отступы - Стенографическое (сокращенное) свойство

Чтобы укоротить код, можно указать все свойства отступов в одном свойстве. Оно называется стенографическим (сокращенным) свойством.

Стенографическое свойство для указания всех свойств отступов - "padding":

Пример

padding:25px 50px;

Попробуйте сами »
Щелкните на кнопке "Попробуйте сами" чтобы увидеть как это работает

Свойство padding может иметь от одного до четырех значений.

  • padding:25px 50px 75px 100px;
    • верхний отступ 25px
    • правый отступ 50px
    • нижний отступ 75px
    • левый отступ 100px

  • padding:25px 50px 75px;
    • верхний отступ 25px
    • правый и левый отступы по 50px
    • нижний отступ 75px

  • padding:25px 50px;
    • верхний и нижний отступы по 25px
    • правый и левый отступы по 50px

  • padding:25px;
    • все четыре отступа по 25px

Примеры

Еще Примеры

Все свойства отступов в одном объявлении
Этот пример демонстрирует стенографическое свойство для установки всех свойств отступов в одном объявлении, может иметь от одного до четырех значений.

Установить левый отступ
Этот пример демонстрирует как установить левый отступ элемента.

Установить правый отступ
Этот пример демонстрирует как установить правый отступ элемента.

Установить верхний отступ
Этот пример демонстрирует как установить верхний отступ элемента.

Установить нижний отступ
Этот пример демонстрирует как установить нижний отступ элемента.


Все CSS Свойства Отступов

СвойствоОписание
paddingСтенографическое свойство для установки свойств отступов в одном объявлении
padding-bottomУстановка нижнего отступа элемента
padding-leftУстановка левого отступа элемента
padding-rightУстановка правого отступа элемента
padding-topУстановка верхнего отступа элемента




« Назад Далее »


  • Регистрация кассы, постановка на учет в налоговые Москвы
    f-service.su
  • оборудованием в аренду Москва. Звоните и бронируйте
    msg-spectech.ru

© 2011 - 2022 Уроки CSS