Справочник по CSS : Тематический указатель : Расширения CSS для Firefox (Gecko) : Свойства : -moz-background-size

смотрим также

Материал из Справочник Web-языков

Перейти к: навигация, поиск


Содержание

Свойство -moz-background-size

Задает размер фонового изображения.

Синтаксис

-moz-background-size: <bg-size> [, <bg-size>]*

Используемые значения

<bg-size>
Может принимать одно из следующих значений:
percentage
Размер фонового изображения задается в процентах от области, определенной для фонового изображения с помощью свойства -moz-background-origin.
auto
Автоматический выбор пропорций изображения. Размер изображения задается с помощью двух параметров: первое значение отвечает за горизонтальный размер, второе - за вертикальный. Если задано значение только для одного из параметров (для ширины или высоты), то второе высчитывается автоматически.
contain
Задает, что фоновое изображение должно быть максимально большим, но так, чтобы размеры изображения гарантированно были меньше или равны заданным значениям для области позиционирования фонового изображения.
cover
Задает, что фоновое изображение должно быть наименьшим, но так, чтобы размеры изображения гарантированно были больше или равны заданным значениям для области позиционирования фонового изображения.

Значением по умолчанию является auto. Атрибут Каскадных таблиц стилей (CSS) не наследуется.

Замечания

Свойство -moz-background-size является новым и требует для работы Gecko 1.9.2 (Firefox 3.6). Но чтобы растянуть фоновое изображение над всей областью, определенной для фона, можно воспользоваться свойством -moz-border-image, которое работает и в Firefox 3.5.

.foo {
        background-image: url(bg-image.png);
       -moz-background-size: 100% 100%;           /* Gecko 1.9.2 (Firefox 3.6) */
         -o-background-size: 100% 100%;           /* Opera 9.5 */
    -webkit-background-size: 100% 100%;           /* Safari 3.0 */
     -khtml-background-size: 100% 100%;           /* Konqueror 3.5.4 */
 
       -moz-border-image: url(bg-image.png) 0;    /* Gecko 1.9.1 (Firefox 3.5) */
}

Примеры

На страницах демонстрация работы свойства background-size: cover и демонстрация работы свойства background-size: contain вы можете увидеть как работает свойство -moz-background-size при значениях cover и content.

На странице демонстрация работы свойства background-size вы можете увидеть как свойство -moz-background-size работает в сочетании с остальными свойствами для фона.

Для просмотра примеров используйте браузер Gecko 1.9.2 (Firefox 3.6).

Стандарты

Это свойство определено в CSS 3 Backgrounds and borders #background-size

Поддерживаемые браузеры

Firefox (Gecko) начиная с версии 3.6 (1.9.2) - для -moz-background-size.

Opera начиная с версии 9.5 - для -o-background-size.

Safari (WebKit) начиная с версии 3.0 (522) - для -webkit-background-size.

Konqueror 3.5.4 поддерживает -khtml-background-size..

Смотрите также

-moz-background-origin, -moz-background-clip, background, background-attachment, background-color, background-image, background-position, background-repeat

Ссылки на источники

https://developer.mozilla.org/en/CSS/-moz-background-size

Добавить страницу в закладки:
РАЗРЕШАЕТСЯ перепечатывать и копировать информацию ТОЛЬКО ПРИ РАЗМЕЩЕНИИ ссылки на оригинал!
(<A href="http://www.spravkaweb.ru/">Справочник Web-языков</A>)
другие проекты
Rambler\'s Top100 Индекс цитирования