Увійти

**Besedin** · 01.11.2007, 01:48 PM

Підкажіть будь ласка як можна зробити розтяжну шапку сайту.

Є 3 малюнки:

1. Логотип (зліва)
2. Малюнок для розтяжності шапки (середина)
3. Додтковий малюнок (зправа)

Як мені вставити це все в шаблон і чи потрібно щось в css?
Припустимо що я знаю як вставити ці малюнки. Як мені зробити щоб 2 малюнок повторювався від першого по третій?

З повагою, Саша

**shaman** · 01.11.2007, 02:09 PM

Ну, щоб шапка розтягувалась, ширина її таблиці повинна бути не у пікселях, а в процентах.
У 2 секції (td), куди ти хочеш вставити малюнок, пропиши код:

Код:
background="http://www.адреса до малюнку"

.

**Besedin** · 01.11.2007, 02:49 PM

дякую.

треба буде спробувати

**Besedin** · 03.11.2007, 10:57 AM

В шаблоні прописав

Код:
<?php $picture_path = $mosConfig_live_site.'/images/';?>

<body>

<div align="center" id="logo">

    <table>

      <tr>

       <td><img src="<?php echo $picture_path;?>logo.gif" width=357 height=120>

       <td width="100%"><background="<?php echo $picture_path;?>logo2addr.gif">

       <td><img src="<?php echo $picture_path;?>adress.gif" width=210 height=120>

      </tr>

    </table>

...

...

В результаті відображається тільки перий і третій малюнок по краях. logo2addr.gif не відображається.

***Dutch*** · 05.11.2007, 01:08 AM

Такі речі краще робити на чистому CSS Smile

**Besedin** · 08.11.2007, 12:10 PM

Пробував інший спосіб

Код:
....

<?php $picture_path = $mosConfig_live_site.'/images/';?>

<style type="text/css">

#logo {

  background:url(<?echo("$picture_path")?>logo2addr.jpg) repeat-x;

  width:100%;

  height:120px;}

</style>

<body>

<div align="center">

<table width="100%" border="0" cellpadding="0" cellspacing="0">

<tr>

  <td>

    <div><img src="<?php echo("$picture_path")?>logo.jpg"></div>

  </td>

  <td width="100%"><div id="logo"><div></td>

  <td>

    <div><img src="<?php echo("$picture_path")?>address.jpg"></div>

  </td>

  </div>

</tr>

</table>

.....

Дещо стало подібне на те що мені потрібно, але заважають інтервали між малюнками (у вкладенні малюнок) Sad

Дивився у кількох книжках по ЦСС. але нічого подібного не знайшов як воно робиться. Дививився і в інтернеті, також нічого.
У верстанні шаблонів поки що мало знаю. На все просто часу не вистачає. Буду вдячний за підказку у вирішенні мого питання Wink

Внизу прикріпив

***Dutch*** · 08.11.2007, 01:07 PM

Вариант на чистому CSS:

Код:
css:

div.bg{

   background:url(../images/background.jpg) repeat-x;

   width:100%;

   height:120px;

}

div.left{

   background:url(../images/left.jpg) no-repeat;

   width:200px;

   height:120px;

   float: left;

}

div.right{

   background:url(../images/right.jpg) no-repeat;

   width:200px;

   height:120px;

   float: right;

}

html:

<div class="bg">

   <div class="left">

   </div>

   <div class="right">

   </div>

</div>

де:
background.jpg - це тло шапки;
left.jpg - ліва частина шапки з лого;
right.jpg - права частина шапки.

**Besedin** · 08.11.2007, 01:50 PM

Дякую Dutch за допомогу +
Все вийшло. Але не зрозумію одне. Чому коли я вставляю твоє CSS в template_css.css то нічого не показує, а лише коли я вставив у index.php тоді запрацювало?

І все таки невеличкий перехід залишився.

***Dutch*** · 08.11.2007, 02:21 PM

ну якщо у тебе в шаблоні є папка для цсс і папка для графіки, то мало б працювати.
Тоді пропиши вірний шлях до графіки, висоту та ширину!!!

Є ще один спосіб - вкладення дівів один в одний.
Тоді потрібно забрати float та дати для всіх дівів однакову висоту та ширину + додати параметр background-position який буде визначати з якої сторони розташовувати праву та ліву картинку.

**Besedin** · 08.12.2007, 10:39 AM

Не буду створювати нву тему, так як маю подібну ситуацію знову.

Чи можливо у вищезгаданому варіанті поставити посередині ще один малюнок?
Якщо так, то як його вирівняти по центру?

Мені вдалось поставити цей малюнок, але правий малюнок відображається нижче

Увійти
Ім’я користувача
Пароль:	Забули пароль?
	Запам’ятати мене