[help] Вопрос по верстке
Допустим я разрезал в фотошопе картинку на кусочки,прикрепил к нужным картинкам ссылки, а теперь встала задача сделать так, что бы на листочке ( на котором обычно пишется текст) отображалось, то что мне надо т.е. текст, Вопрос таков: какая должна быть запись, да бы текст отображался именно на этом листке и не вылазил за пределы листка.
— Дизайны на заказ 1236548
Может я чего-то не понял,но думаю тег <pre>...</pre> подойдет.(Текст будет написан также как и в редакторе - строчки также,переносы и т.д.)
— Newbie!
Совсем не понял вопроса, но по моему не к картинке лучше прописывать ссылки, а к ссылке применить стиль, в бэкграунде которого будет картинка и в таком случае размещай текст на картинке так как сам этого захочешь, а вообще способов тьма, ну если я вообще говорю о том о чем ты спросил)))
На Форуме я тоже Radar!
Я везде Radar!
Меня наверно не поняли
Допустим я разрезал в фотошопе картинку.
Вот кусочек кода, что выдает фотошоп при сохранении в веб
<td rowspan="6">
<img src="skins/proba/images/334_07.gif" width="62" height="243" alt=""></td>
<td>
<img src="skins/proba/images/334_08.gif" width="156" height="60" alt=""></td>
<td rowspan="9">
<img src="skins/proba/images/334_09.gif" width="46" height="815" alt=""></td>
<td colspan="2" rowspan="8">
<img src="skins/proba/images/334_10.gif" width="554" height="790" alt=""></td>
<td colspan="2" rowspan="7">
<img src="skins/proba/images/334_11.gif" width="206" height="501" alt=""></td>
<td>
<img src="skins/proba/images/spacer.gif" width="1" height="60" alt=""></td>
</tr>
<img src="skins/proba/images/334_10.gif" width="554" height="790" alt=""></td>
— Дизайны на заказ 1236548
ну а я имел ввиду это.
На Форуме я тоже Radar!
Я везде Radar!
хорошо с этим я разобрался должно было получится вот это
if (file_exists('module/'.$id . '.php'))
include('module/'.$id . '.php');
else
{
include('module/eror.php');
}
?></td>
Но теперь другой вопрос, как сделать что бы текст не пытался растягиваться а получился "скорл" [attachment=3342:__________.png]
— Дизайны на заказ 1236548
Думаю все с нуля объяснить в топике займет достаточно много как времени так и места.
Так что просто дам ссылочки которые мне в свое время очень сильно помогали.
Именно по твоему вопросу:
_http://www.4webmaster.ru/articles/85/
И вот несколько просто полезно иметь под рукой:
_http://www.xiper.net/html-and-css-tricks/verstka-form/blochnaya-verstka-form.html
_http://softwaremaniacs.org/blog/category/web/primer/
Если что пиши (только не сегодня
), чем смогу помогу.
На Форуме я тоже Radar!
Я везде Radar!
Добрый вечер.
Допустим имеется вот такой дизайн.
Как правильно его разрезать, что бы он растягивался и еще, как сделать, что бы диз растягивался ( какие махинации для этого нужны) :)
Верстка таблицами
— Дизайны на заказ 1236548
Ну поехали...
Итак порежем макет (я беру во внимание только главный блок, который мы и будем растягивать) следующим образом:
- 1, 3, 6 и 8 элементы разрезать лучше одинаковыми равносторонними квадратами (т.к. проще верстать будет), но из-за того что ввержу присутствует градиент надо быть повнимательнее с этим делом.
- Далее отрежем 2, 4, 5 и 7 элементы тоже равными долями например квадратами 10 х 10px.
- Ну и наконец элемент обозначенный на рисунке номером 9 - тут все зависит от того из чего он состоит, в данном случае это тупо белый цвет (при условии того что в вырезанные элементы 1,2,3 уместился весь Градиент), следовательно тут нам резать ничего ненадо мы просто сделаем заливку Белым цветом посредством HTML
Все картинки порезанные выше я буду обозначать по соответствующим номерам (1.jpg, 2.jpg, ..., 8.jpg. А фон элемента 9 в формате RRGGBB выглядит так - F1EFFO)
Ну вроде бы разрезали.
Теперь приступим к сбору элементов в одну таблицу (т.к. речь идет о табличной верстке) и постараемся перенести то что мы видим на картинке в HTML:
Начнем с HTML и впишем туда для начала просто таблицу, состоящую из 3-х ячеек и 3-х столбцов.
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
Она у нас будет основой - с ней мы и будем работать.
Далее мы либо с помощью css либо с помощью тега style в HTML вставляем эти картинки в таблицу, при этом мы обязательно указываем что элементы 1,3,6 и 8 повторяться не должны с помощью параметра no-repeat, а вот элементы 2, 4, 5 и 7 делаем повторяющимися по следующей схеме - 2 и 7 по оси Х, а 4 и 5 по оси У, то есть repeat-x и repeat-y соответственно.
а элемент 9 мы воспроизведем цветом фона нужной ячейки таблицы.
Ну и немного поманипулировав получаем такой код:
<tr height="64px">
<td style="background: url('img/1.jpg') no-repeat; width: 64px; height:64px;"> </td>
<td style="background: url('img/2.jpg') repeat-x; height:64px;"> </td>
<td style="background: url('img/3.jpg') no-repeat; width: 64px; height:64px;"> </td>
</tr>
<tr>
<td style="background: url('img/4.jpg') repeat-y; width: 64px;"> </td>
<td style="background: #F1EFF0;">Сюда мы вставляем нужный текст и смотрим на разных разрешениях экрана.</td>
<td style="background: url('img/5.jpg') repeat-y; width: 64px;"> </td>
</tr>
<tr height="64px">
<td style="background: url('img/6.jpg') no-repeat; width: 64px; height:64px;"> </td>
<td style="background: url('img/7.jpg') repeat-x; height:64px;"> </td>
<td style="background: url('img/8.jpg') no-repeat; width: 64px; height:64px;"> </td>
</tr>
</table>
Уаля.
Теперь у нас таблица растягивается как по вертикали, так и по горизонтали, не теряя при это форму.
Ну если вопросы будут - милости прошу - описываем ситуацию, на выходе получаем мини урок.
Но весь ХТМЛ разжевывать каждому не собираюсь, так что прошу обращаться знающих хотя бы минимум в ХТМЛ.
© Radar.
На Форуме я тоже Radar!
Я везде Radar!
radar,жаль опередил)
Вообще хватило бы 3 ячеек.Зачем девять?
http://la2base.ru/client/dop_client/1879-djevid-blejjn-dobralsja-i-sjuda.html Девид блейн добрался и сюда.(c)KKKrevedko
— Client Developer
KKKrevedko: radar,жаль опередил)
Вообще хватило бы 3 ячеек.Зачем девять?
9-ю ячейками я показал что можно не только по горизонтали тянуть, но и по вертикали.
На Форуме я тоже Radar!
Я везде Radar!
BestMan: Создай тогда лучше уже отдельный файл стиля.
Читай внимательно или не пиши вообще:
На Форуме я тоже Radar!
Я везде Radar!
Кстати
Для этого надо просто применить к ячейке с текстом стиль overflow
Почитать об этом можно тут: http://www.htmlbook.ru/css/overflow.html
http://la2base.ru/client/dop_client/1879-djevid-blejjn-dobralsja-i-sjuda.html Девид блейн добрался и сюда.(c)KKKrevedko
— Client Developer
KKKrevedko: Кстати
Для этого надо просто применить к ячейке с текстом стиль overflow
Почитать об этом можно тут: http://www.htmlbook.ru/css/overflow.html
со скорлом давно разобрался уже)
— Дизайны на заказ 1236548






