background

    0
    136

    background — это универсальная запись для установки большинства свойств фона в одном месте.

    Это свойство может принимать по одному значению от каждого из свойств фона практически в любом порядке. Не установленные правила будут принимать значение inherit. Параметры устанавливаются для правил: background-position, background-image, background-size, background-repeat, background-origin, background-clip и background-attachment

    CSS правила приведенные ниже, для селектора body эквиваленты в обоих случаях.

    Если свойства background не заданы, то значения устанавливаются по умолчанию:

    Другими словами, background назначает явные значения, заменяя начальные или добавляя недостающие значения.

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

    В примере ниже мы устанавливаем через свойство background значение для свойства background-repeat:

    Объявление значения выше эквивалентно следующей записи:

    Когда вместе с фоновым изображением требуется указать цвет фона, то цвет указывается в последнюю очередь

    Значения <box> могут быть следующими: padding-box, content-box, и border-box (Подробнее background-clip).

    Если указан только один <box>, тогда устанавливаются сразу два значения, background-origin и background-clip, если устанавливается второй <box>, то в первом указывается background-origin, а во втором background-clip.

    Официальный синтаксис

    • синтаксис
    • Значения по умолчанию, если не задано:
      • background-image: none
      • background-position: 0% 0%
      • background-size: auto auto
      • background-repeat: repeat
      • background-origin: padding-box
      • background-clip: border-box
      • background-attachment: scroll
      • background-color: transparent
    • Применяется: ко всем элементам
    • Анимируется: только background-color, background-position, и background-size могут иметь анимацию.

    Примечание

    Значения отдельных свойств фона в универсальной записи могут быть переопределены. Единственное требование — указать background-size после background-position и эти свойства должны быть разделены через косую черту ‘/’. Вы не можете указать размер фона в универсальной форме записи background, если вы не указали background-position. В других случаях объявление не действительно.

    Пример

    Пример ниже показывает, как можно указать несколько фоновых изображений через background:

    Запись ниже эквивалентна записи выше:

     

    ПОДЕЛИТЬСЯ
    Следующая статья::after
    Постоянный автор на exabyte.ws. Специализируюсь на Wordpress, Javascript & jQ, REST API. Любые вопросы связанные с Web разработкой вы можете задать лично или в группе вконтакте.

    ОСТАВЬТЕ ОТВЕТ

    Пожалуйста оставьте комментарий!
    Введите ваше имя