Jump to content
  • 0

Проблема с версткой


arta
 Share

Question

Здравствуйте форумчане. У меня возник такой непростой вопрос. Я верстаю макет, не могу сверстать одну вещь а именно, вот эти две крайние картинки. Вот ссылка на картинку. http://i042.radikal.ru/1108/7d/072d46e33d59.png . Пожалуйста помогите с этой проблемой. Рамки нужно сделать именно картинкой.

Link to comment
Share on other sites

7 answers to this question

Recommended Posts

  • 0

Здравствуйте! Если речь идет о голубых рамках - то я не вижу проблемы!

Делайте в общем бллоке:

<div class="общий блок">

<div class="левая синяя картинка"><img alt="" src="папка с картинкой/имя картинки" /></div>

<div class="правая синяя картинка"><img alt="" src="папка с картинкой/имя картинки" /></div>

</div>

А в папке css пишите:

.левая синяя картинка{

float:left;

}

.правая синяя картинка{

float:right;

}

P.S. Только названия давайте латиницей...

Link to comment
Share on other sites

  • 0

Попробовал этот способ но получилось что они не растягиваются до конца. Скрин: http://s56.radikal.ru/i153/1108/8d/18875b0b84c2.png

мне кажется их надо разрезать по маленьким частям, то есть вверх середина и низ, и как то поставить, только вопрос в том как.

Link to comment
Share on other sites

  • 0

Задайте общему блоку:

{

margin:0 auto;

}

левая синяя картинка в HTML коде внутри общего блока должна быть первой

правая синяя картинка-последней!

Другие блоки не должны иметь свойств 'float'

И на всякий случай задайте св-во этим блокам в CSS:

{

display:block

height:высота внутренней картинки img;

width:ширина внутренней картинки img;

}

и можете поэкспериментировать добавить этим блокам

{Clear:both} на всякий случай...

Link to comment
Share on other sites

  • 0

Если сайт будет фикс, делай одну картинку с прозрачной серединой и полосками по бокам на всю ширину белого блока.

И



background:url(...) repeat-y;

этому блоку.

И внутренние отступы под синие полоски по бокам в этом же блоке.

Link to comment
Share on other sites

  • 0

Нужно аккуратненько вырезать фрагменты крайних полосочек — обрезать слева темно-серый фон и справа белое поле (по вертикали обрезать оставшуюся голубую полоску так, чтобы при тиражировании этих фрагментов по вертикали не было видно стыков), назвать эти фрагменты, например left.png и right.png, а потом написать простенький код:

<div style="backgraund:url(left.png) 0 0 repeat-y;">

<div style="backgraund:url(right.png) 100% 0 repeat-y;">

<!--Здесь будет содержимое. То, что между голубых полосок-->

</div>

</div>

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

×
×
  • 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