Версия для печати темы

Нажмите сюда для просмотра этой темы в обычном формате

Форум веб-мастеров _ Общие вопросы _ два фоновых изображения

Автор: comrad 10.5.2008, 4:07

возможно ли создать два фоновых изображения? например: одно заполняет верхнюю часть страницы
на 100px , а второе заполняет остальное пространство?

Автор: Владислав Алексеевич 15.6.2008, 3:24

Грубо говоря - нет. (Правда я не уверен в этом).
Но есть довольно приятный обходной вариант. Использовать таблицы. В каждой ячейке таблицы можно установить свой бэкграунд (задний фон).

Код
<html>
<head>
<title>Пример</title>
</head>

<!-- задний фон в BODY повторяется полностью (замощает весь экран) -->
<body background="a1.gif" style="background-repeat:repeat">

<table width="100%" border="1">
  <tr height="300">
    <!-- Тут задний фон ставится на одну чейку. и повторение только по оси X, например -->
    <td background="a2.gif" style="background-repeat:repeat-x">Это ячейка 1</td>
    <td>Это ячейка 2</td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
  </tr>
</table>

</body>
</html>


Один из вариантов: сделать шапку сайта как задний фон таблицы, а основное тело - фоном BODY. Но я бы всё сделал в таблице. И скин шапки и тело сайта и низ сайта. Ведь таблицу можно растянуть полностью по ширине экрана. (Тело BODY тоже нужно сделать "полноэкранным")

эти 6 параметров обеспечат полную широту BODY, и таблица будет отображаться от края до края.
Код
<body background="a1.gif" style="background-repeat:repeat" marginheight="0" marginwidth="0" bottommargin="0" topmargin="0" leftmargin="0" rightmargin="0">

где все "margin"-ы означают отступы соответствующие их названиям. (Да, часть из них повторяется. Одни используются в IE, а другие в других браузерах.)

Саму же таблицу, надо оформить так:
Код
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">

где cellspacing - расстояние между ячейками в таблице, а cellpadding - расстояние от самой ячейки до данных в ней. Ну и,конечно же, ширину границ надо занулить border="0".
Теперь наша таблица стала цельной - без дырок в скинах. Теперь можно радостно заполнять ячейки задним фоном, не боясь "белых дырок". )

Invision Power Board ()
© Invision Power Services ()