Фонові зображення
Русский перевод: Фоновые изображения
Передбачено кілька властивостей, які використовуються для маніпуляції фоновими зображеннями. На щастя властивість background
використовується з усіма ними.
body { background: white url(http://www.htmldog.com/images/bg.gif) no-repeat top right; }
Це включає в себе наступні властивості:
background-color
, з яким ми стикалися раніше.background-image
, яке представляє собою місцезнаходження самого зображення.background-repeat
, яке вказує, як зображення повторюється. Можливі значення: repeat, repeat-y, repeat-x, no-repeat.background-position
, показує розташування зображення. Можливі значення: top, center, bottom, left, right або їх комбінації.
Фонові зображення можуть використовуватися для більшості елементів HTML, а не тільки для сторінки повністю (body
). Вони можуть застосовуватися і для простих, але ефективних рішень – наприклад, для створення закруглених куточків.
Легко захопитися технікою фонових зображень і почати розміщувати їх по всій сторінці. Деякі візуально гіперактивні люди впевнені, що сторінка виглядає добре, коли яскраві кольорові фотографії накладаються одна на одну по всьому фону, примушуючи користувача «розгадувати» текст на передньому плані. Це екстремальний приклад. Найбільш дружній до користувача текст – чорний на білому фоні або білий на чорному фоні.
Тому краще використовувати фонові зображення там, де на верхньому шарі не буде контенту, або робити фонові зображення дуже світлими. Це також може зменшити вагу файлу зображення, якщо застосовується формат з індексованою палітрою кольорів (наприклад, GIF).