Фоновые изображения в CSS.

Как создать сайт?
Как создать свой сайт легко и просто, имеются библиотеки html, css, php, javascript, jquery, web-график.

автор: Васильев Олег Никандрович.

Используя CSS, Вы не привязаны к мозаичным шаблонам и можете располагать фоновые изображения где угодно. К тому же их можно объявить для любого из элементов в отдельности. Здесь рассказывается о существующих в CSS свойствах для добавления и использования фоновых иллюстраций, начиная с основы основ - свойства background-image и переходя к более развитым возможностям контроля их поведения, таким, как управление шаблонами с повторением, позиционирование изображения в элементе страниц сайта и предотвращение прокрутки изображения на странице.

Советы по работе с фоновыми изображениями.

Работая с фоновыми рисунками, не забывайте следующие моменты:

• Выбирайте рисунки, которые не мешают чтению размещенного поверх текста.

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

• Присвойте атрибуту background-color значение, совпадающее с основным цветом фоновой иллюстрации. Если рисунок не удастся вывести на экран, дизайн страницы как минимум сохранится. Это особенно важно, если цвет текста труден для чтения на белом (или на светло-сером) фоне, который браузер выбирает по умолчанию.

Свойство background-image в CSS. Значения:

uri none inherit

Начальное значение: none. Ко всем элементам. Нет. Применимо: Наследуется: Нет.

Свойство background-image - основной способ добавления иллюстраций к фону (или на «полотно») элемента. По отношению к body он действует как background, вызывая горизонтальное и вертикальное тиражирование рисунка до заполнения окна браузера. В отличие от атрибута background свойство background-image может применяться к любому входящему в документ элементу как на уровне блока, так и локально.

Свойство background-image в CSS не наследуется (как не наследуется, по сути, ни одно из свойств фона), а вместо этого через дочерние элементы с фоном, прозрачным по умолчанию, просто просвечивает шаблон. В том случае, если бы мозаичные изображения наследовались, на экране получилась бы мешанина, в которой новый шаблон мозаики начинался бы в левом верхнем углу каждого элемента страницы. Мы то с Вами уже знаем, что любое отображение элемента по умолчанию начинается с левого верхнего угла.

При заданном свойстве background-color в CSS изображение помещается поверх указанного в нем цвета. Включая в элемент иллюстрацию, всегда присваивайте близкий цвет фону. В итоге, если рисунок загрузить не удастся, и текст и передний план останутся удобны для чтения. Ну, это и понятно, потому он и называется фоновым цветом данного элемента. Было бы иначе все бы закрыло.

Для примера мы выделили общий текст данной статьи в один блок div и назначили ему этот цвет фона, что Вы видите на странице сайта.