Jump to content
  • 0

Резиновая шапка

Безымянный

Asked by Безымянный,

 Share

Question

Безымянный Explorer

Безымянный

Posted
Posted (edited)

Добрый вечер, господа!

Чтож, у меня такая проблема. Нужно оптимизировать шапку под все браузеры и сделать её резиновой, чтобы при сужении окна или при просмотре страницы через разные браузеры части шапки не наесжали друг на друга. Так же мне сказали, что размеры шапки нужно делать под разрешение 800х600... Так у меня в два раза больше разрешение экрана(( Если я так сделаю, то у меня будет не одна картинка, а две в шапке страницы... Такая проблема, что у меня шапка очень большая, а при уменьшении всё искажается(( Я и так искозил её максимально... Запутался я В общем, господа и прошу помощи...

Код шапки, чтобы сделать её резиновой. К сожалению, вроде всё пересмотрел и вроде всё необходимое добавил, но всёравно ничё не работает...

<table border="0" cellpadding="0" cellspacing="0" width="100%"  height="356">
<tr>
 <td width="357" align="right center" rowspan="2"><img src="http://www.nimpo.at.ua/dezain/shapka1.jpg" left no-repeat; border="0" valign="bottom"></td>
 <td rowspan="2" align="center center" style="background:url(http://www.nimpo.at.ua/dezain/shapka3.jpg) left no-repeat; padding-bottom:50px;" valign="bottom"><span style="color:#790000;font:20pt bold Verdana,Tahoma;"><b>Найди свой путь шиноби...</b></span><br /><img src="http://s22.ucoz.net/t/431/14.gif" width="75" height="1" border="0"> </td>
 <td width="357" rowspan=2 align="left center" style="background:url(http://www.nimpo.at.ua/dezain/shapka2.jpg) left no-repeat; color:#790000;" valign="bottom"></td>
</tr>
</table>

Впринципе, для большей убедительности, вырезки из Оперы и Осла(IE)... В Мазиле Файрофоксе тоже самое, что и в Опере...

c87b6cf6c35a.jpg

075e7a571b93.jpg

Edited by Безымянный
Link to comment
Share on other sites

49 answers to this question

Recommended Posts

  • 0
Victor Ananiev Explorer

Victor Ananiev

Posted
Posted

Чем не подходит? ответь четко, тем более тебе голова зачем, сам переверстай готовый пример под себя, за тебя зделали больше чем делают за остальных. ДУМАЙ ГОЛОВОЙ!!!!!!!!!!

Link to comment
Share on other sites
  • 0
kalyaka-malyaka Explorer

kalyaka-malyaka

Posted
Posted
Да не подходит мне такое решение!((

знаешь, пупсик, если тебя мама даже не научила спасибо говорить, когда люди на тебя время тратят (на объяснения, почему не подходит, даже расчитывать глупо, понимаю), боюсь, тут тебе никто не поможет. RTFM

Link to comment
Share on other sites
  • 0
Безымянный Explorer

Безымянный

Posted
  • Author
Posted

:( Я пупсик..

Научили меня всё говорить, только я не просил на меня тратить время и давать какие - то коды.. Мне нужно было кокнретно сказать, что исправить или что добавить..

:) Я видел советы, использовал их, делал и вот что получилось.. Шапка стоит по центру, но не влезает, так что края не видно.. А мне нужно, чтобы она уменьшалась при смене браузера.. Блин, четвёртый раз говорю((

:( Не понимаю, что не так...

<table border="0" cellpadding="0" cellspacing="0" width="100%" style="background:url(http://www.nimpo.at.ua/dezain/shapka.jpg) center no-repeat;; #E2C275;" height="356">
<tr>
<td width="357" align="right center" rowspan="2" valign="bottom"></td>
<td rowspan="2" align="center center" style="background:url() left no-repeat; padding-bottom:50px;" valign="bottom"><span style="color:#790000;font:20pt bold Verdana,Tahoma;"><b>Найди свой путь шиноби...</b></span><br /><img src="http://s22.ucoz.net/t/431/14.gif" width="75" height="1" border="0"> </td>
<td width="357" rowspan=2 align="left center" style="background:url() left no-repeat; color:#790000;" valign="bottom"></td>
</tr>
</table>

Link to comment
Share on other sites
  • 0
homm Explorer

homm

Posted
Posted

> Ну неужели никто не может дать мне конкретный ответ! Что нужно добавить в код, чтобы картинки не смещались...

> я не просил на меня тратить время и давать какие - то коды..

> Мне нужно было кокнретно сказать, что исправить или что добавить..

Эти противоречия не разрывают тебя на части? Думай башкой, тебе достаточно уже скахзали.

Link to comment
Share on other sites
  • 0
homm Explorer

homm

Posted
Posted
Шапка стоит по центру, но не влезает, так что края не видно..

Когда ты научишся пользоваться компьютераом. Точнее если ты научишся, ты узнаешь что окно браузера можно не на весь экран сделать. А потому ты узнаешь что у разных людей разные мониторы и они используют разные разрешения. И твой мир вообще нафиг первернется и ты сойдешь с ума.

Link to comment
Share on other sites
  • 0
Безымянный Explorer

Безымянный

Posted
  • Author
Posted (edited)
:) Думаешь я такой тупой? Конечно же я знаю, что у всех разные экраны... Вообще нужно оптимизировать сайт под разрешение 800х600... Мне известно всё это)) Думаешь я просто так дал название теме " резиновая шапка "?)) Я хочу её оптимизировать под все браузеры и все экраны, чтобы при увеличии или уменьшении окна структура сохранялась... Edited by Безымянный
Link to comment
Share on other sites
  • 0
homm Explorer

homm

Posted
Posted

Хочешь решение взрывающее мозг? У тебя там в опере рядом с вкладками слева есть кнопочка с гаечным ключом и отверточкой. Нажми её. Только убедись, что сидишь, и аккуратнее, от шока можешь остаться идиотом на всю жизнь.

Link to comment
Share on other sites
  • 0
Безымянный Explorer

Безымянный

Posted
  • Author
Posted

То решение, что вы все сказали-верное, но не подходящее... Неужели все считают, что я не заметил, что необходимо разделить шапку на более мелкие части, а как предполагает код каляки-маляки, вроде бы на 8, уже не помню.. Мне необходимо 3 части и я не считаю, что выравнять их всех в размер окна - очень сложно! Однако, как это сделать - не увидел..

:) homm, ну ну, я прямо - таки отупел.. Мне необходимо, чтобы структура сохранялась! Внимательно прочитай...

Link to comment
Share on other sites
  • 0
kalyaka-malyaka Explorer

kalyaka-malyaka

Posted
Posted
:) Думаешь я такой тупой? Конечно же я знаю, что у всех разные экраны... Вообще нужно оптимизировать сайт под разрешение 800х600... Мне известно всё это)) Думаешь я просто так дал название теме " резиновая шапка "?)) Я хочу её оптимизировать под все браузеры и все экраны, чтобы при увеличии или уменьшении окна структура сохранялась...

*очень стараясь сохранять спокойствие* может, ты все-таки сконцентрируешься и постараешься вербализировать, что тебя не устроило тут? я искренне хочу понять.

Link to comment
Share on other sites
  • 0
Безымянный Explorer

Безымянный

Posted
  • Author
Posted

Я искренне хочу, чтобы ты не поняла...

:) Меня не интересуют ни твои нервы, ни твои нервные взрывы или злость... Так что спокойствие можешь не сохранять, ибо меня это особо не волнует...

Link to comment
Share on other sites
  • 0
homm Explorer

homm

Posted
Posted

Уже лучше. Видно, что не бузнадежен.

Определись что должно по твоему мнению должно происходить при умньшении размеров шапки. Например если не изменять размер картинки, при 800 в ширину два персонажа по бокам будут скорее всего не видны. А можно сверстать с изменением размеров, тогда качество будет страдать от интерполяции, но персонажей будет видно. Какой вариант тебя больше устраивает?

Link to comment
Share on other sites
  • 0
Безымянный Explorer

Безымянный

Posted
  • Author
Posted

:) * пытается догнать *Тоесть, ты мне предлагаешь два варианта.. Если окно меньше - портится качество или не влезает часть шапки? То, что не влезает - у меня уже есть.. Впринципе, мне бы так, как вот, ммм.. здесь - http://userbars.ucoz.ua/

Сохраняется строение.. Тоесть мне необходимо, чтобы при уменьшении окна уменьшались размеры.. А при этом искажалось изображение или нет? Пожалуй, искажалось..

Link to comment
Share on other sites
  • 0
homm Explorer

homm

Posted
Posted

Не понятно при чем здесь страница, которую ты привел, ну да ладно.

Тогда вырежи края, там где орнамент в отдельные картинки со всех стороно. Это нужно сделать потому что они не должны изменять размер, значит должны быть отдельно. Теперь убери для шапки все жестко заданные высоты элементов.

Основное изображение сделай в виде тега img сшириной 100% и без высоты, тогда при изменении размеров соотношение сторон будет сохраняться. Края пусти повторяющимися с помошью background: repaet-x и repeat-y.

:) * пытается догнать *Тоесть, ты мне предлагаешь два варианта..

Есть третий, конечно, но как я понял у тебя нет исходника картинки и фототшопом ты не владеешь настолько что-бы самому обтравить фон от картинок, так что 2.

Link to comment
Share on other sites
  • 0
Безымянный Explorer

Безымянный

Posted
  • Author
Posted

:(:) Пипец...

<!-- Header -->

<table border="0" cellpadding="0" cellspacing="0" style="background:url(http://www.nimpo.at.ua/dezain/shapka.jpg) center no-repeat; #E2C275;" width="100%">

<tr>

<td width="356" rowspan="2" valign="bottom" style="background:url(http://www.nimpo.at.ua/dezain/shapka1.jpg) repaet-x></td>

<td rowspan="2" width="100% align="center" style="background:url(http://www.nimpo.at.ua/dezain/shapka3.jpg) left no-repeat; padding-bottom:50px;" valign="bottom"><span style="color:#790000;font:20pt bold Verdana,Tahoma;"><b>Найди свой путь шиноби...</b></span><br /><img src="http://s22.ucoz.net/t/431/14.gif" width="75" height="1" border="0"> </td>

<td width="356" rowspan=2 style="background:url(http://www.nimpo.at.ua/dezain/shapka2.jpg) repaet-y; color:#790000;" valign="bottom"></td>

</tr>

</table>

<!-- /Header -->

33ed8f3ca0cb.jpg

Link to comment
Share on other sites
  • 0
Resel Explorer

Resel

Posted
Posted
не разрезайте ее, а просто поставьте целиком и задайте ширину 100% (style="width: 100%;") и тогда она растянется на ширину содержащего ее контейнера (если она просто в body, то на ширину всего окна, какой бы ширины оно не было). Если изображение лежит в диве или таблице, то им надо тоже просто проставить ширину 100%. Высота подберется автоматически.

На очень больших экранах качество картинки немного ухудшится из-за растягивания.

Во-о!!! Наконец-то нашёл. Зашёл сюда за этим же. Уже искал форматы графики на увеличение под опред. размер... Поставил в ячейку таблицы

ширину 100 и даже попробовал нажать значок % на клавиатуре- получилось ! Надо будет почаще заглядывать в теги...

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept