На главную

Библиотека Интернет Индустрии I2R.ru

Rambler's Top100

Малобюджетные сайты...

Продвижение веб-сайта...

Контент и авторское право...

Забобрить эту страницу! Забобрить! Блог Библиотека Сайтостроительства на toodoo
  Поиск:   
Рассылки для занятых...»
I2R » Сайтостроительство » CSS

Размещение фона на странице

Задача стоит следующая. Необходимо разместить фоновую картинку в одном из углов веб-страницы или ее таблицы при помощи стилей. Чтобы поместить рисунок в виде фона на веб-странице надо прописать следующий код.

Пример 1. Фон на странице

html
style type="text/css"
!--
body { background-attachment: fixed; background-image: url(mybg.gif); background-repeat: no-repeat; background-position: right bottom }
--
/style

body
Содержимое страницы
/body
/html

Имя рисунка и путь к нему пишется внутри параметра url (например, url(mybg.gif)), а положение фона определяется параметром background-position. У него два значения, положение по горизонтали (может быть - right, left, center) и вертикали (может быть - top, bottom, center). В примере 1 фон будет помещен в правый нижний угол страницы. Если нужно определить рисунок в левом верхнем углу, то надо задать следующий вид: background-position: left top.

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

Пример 2. Фон в таблице

html
body

table
trtd style="background-attachment: fixed; background-image: url(mybg.gif); background-repeat: no-repeat; background-position: left top"

Содержимое таблицы

/td/tr
/table
/body
/html

Тут может возникнуть проблема, связанная с разной интерпретацией CSS браузерами Netscape и Internet Explorer. У последнего работает все корректно, а вот Netscape помещает фон не в угол ячейки, как было бы правильно, а в угол страницы. Поэтому в разных браузерах пример 2 будет работать и показываться по разному. Как добиться однообразия пока не знаю, будут идеи - пишите, обсудим.

Влад Мержевич
Рецепты HTML

Спонсор раздела

Рассылки Subscribe.ru:

Библиотека сайтостроительства - новости, статьи, обзоры
Дискуссионный лист для web-разработчиков
Подписка на MailList.Ru
Автор: NunDesign
Другие разделы
Оптимизация сайтов
Web-студии
» Новое в разделе
Web-дизайн
Web-программирование
Интернет-реклама
Раскрутка сайта
Web-графика
Flash
Adobe Photoshop
Рассылка
Инструменты вебмастера
Контент для сайта
HTML/DHTML
Управление web-проектами
CSS
I2R-Журналы
I2R Business
I2R Web Creation
I2R Computer
рассылки библиотеки +
И2Р Программы
Всё о Windows
Программирование
Софт
Мир Linux
Галерея Попова
Каталог I2R
Партнеры
Amicus Studio
NunDesign
Горящие путевки, идеи путешествийMegaTIS.Ru

2000-2008 г.   
Все авторские права соблюдены.
Rambler's Top100