Кот |
Привет, Гость! Войдите или зарегистрируйтесь.
`tsunami
у меня сразу вопрос, перед тем, как начну все делать. шапка, ты сказала, 500*850. это понятно. не понятно, как ты сделала картинки, выходящие за шапку
ну, на макете в фотошопе еще понятно как это сотворить. а вот как это потом сделать в самом дизе на форуме.
остальное понятно)
Gerda
Прости, я не тот урок кинула, пересмотри. Другой сейчас.
Gerda
Ну, за него нет оценки, задание слишком мало)) а вот теперь тот, который я тебе случайно кинула:
Разные виды дизайнов
Часть 1. Объединенный дизайн.
На основе статьи by `tsunami.
Этот вид дизайнов сейчас довольно популярен, но слишком многие считают, что это трудно, они не справятся и прочее. На самом деле, делается это довольно легко, но работа может казаться сначала трудоемкой (если ты вдруг накосячила где-то). А вот то, что у нас должно получиться: http://obdiz.mybb.ru/
1. Итак, заходим в фотошоп и создаем новый файл (думаю, скрин тут не нужен). Размер можно взять 1900 х 1080 для широкоформатных мониторов, но я обычно беру где-то 1500 х 1080, чтобы дизайн отображался полностью или почти полностью на ноутбуках, планшетах или нетбуках. Тут уже зависит от твоей цели, но мне работу будет удобнее смотреть, если ты возьмешь 1500 (или 1400)х1080.
2. Заливаем этот файл тем цветом, который ты бы хотела видеть фоном форума. Картинку использовать не советую, с этим будет дольше и сложнее, во всяком случае, для начинающих дизайнеров.
3. Создаем еще один файл. Высота его должна быть как и у предыдущего документа (1080 в моем случае), а ширина файла - это ширина нашего форума. Думаю, логичнее будет взять 850 х 1080.
4. Этот файл (который мы создали в пункте 3) заливаете тоже цветом, но другим, чтобы не путаться.
5. Затем этот файл №2 (назовем его так) выделяем (Ctrl + A), копируем (Ctrl + C) и вставляем в файл №1 (Ctrl + V). Если файл №2 встал по центру файла №1, то ты все сделала правильно.
6. Создаем еще один файл (файл №3). Ничем его не заливаем, оставляем белым. Высота файла - это высота твоей шапки. Я беру 500, стандарт - 400. Ширина та же, что и у предыдущего файла (850). В нашем случае надо брать файл (шапку) той велечины, что ты выставила в предыдущем уроке, когда мы первое окно стиля разбирали.
7. Выделяем его (Ctrl + A), копируем (Ctrl + C) и вставляем в два предыдущих совмещенных файла (Ctrl + V).
8. Будущая шапка тоже должна встать по центру. Берем инструмент перемещения и двигаем ее наверх, туда, где и располагается обычно всякая нормальная шапка. Только двигай ее не за пределы второго слоя, можешь взять инструмент масштаб, увеличить и проверить.
9. А дальше делаем все так, как тебе нужно - коллаж, текст и т.д. Сейчас можно ограничиться просто большой картинкой или несколькими, скромным коллажиком. Если хочешь, можешь делать глобально.
10. Дальше первые два слоя (у меня голубенький и бежевый) объединяем друг с другом и со всем, что сделали. Белый слой остается необъединенным. Его мы перемещаем на самый верх.
11. Берем инструмен выделение и аккуратненько выделяем белую область белого слоя, который у нас сверху. Вот здесь обычно и начинаются ошибки, так как выделить надо постараться очень ровно, чтобы не было потом швов.
12. Выделила? Теперь идем в слои и делаем белый слой невидимым (нужно нажать на глазик около этого слоя).
13. Дальше копируем выделенную область (Ctrl + C). Главное, смотри, чтобы у тебя был активным не белый слой, который мы сделали невидимым, а фон - объединенный слой. Иначе ничего не получится.
14. Создаем новый документ (фотошоп сам подгонит его под размер той области, которую ты скопировала).
15. Вставляем в этот новый документ выделенную область (Ctrl + V). Если документ так и остался белым, значит, это сигнал к тому, что ты не объединила слои или белый слой все-таки был активным, а не фон.
16. Сохраняем все отдельно - шапку и фон. Готово.
Когда-то давно я сама училась по похожей статье.
Сейчас даже автора не вспомню, прошу извинить. Эту статью писала сама так, как делаю это я.
Задание
1. Можешь создать новый тестовик, можешь переделывать этот - тебе нужно попробовать сделать объединенный дизайн.
`tsunami
и у меня возникает тот же вопрос про шапку и ее границы. а точнее, про картинки вне шапки
Gerda
Там же все расписано в уроке. Я не понимаю, что ты не понимаешь.
разобралась
http://testgerda.mybb.ru/
если убрать цвет у тела форума - фон не до конца страницы. и получается разрыв между телом и подписью.
если поставить цвет обратно и сделать его повторяющимся - тогда на дизе обрезается нога Шарлиз, которая попадает как раз на тело форума.
Отредактировано Gerda (2013-03-08 07:01:57)
Gerda
Конечно, она будет обрезаться! Она же попадает на тело форума. А ты как хотела?
После картинки ты прописываешь еще и backround-color с таким значением, какого цвета у тебя фон, чтобы не было этого разрыва. Картинка с фона не должна повторяться.
/* CS1.1 *//* тело форума*/
#pun { background-color: none;
background-repeat: repeat;
background-position : bottom;}
/* CS1.2 *//*фон форума*/
body {background-image : url("https://forumstatic.ru/files/0012/57/53/53853.png");
background-color: #CD9B9B;
background-repeat: no-repeat;
background-position : top center;
overflow-x: hidden;
}все правильно в коде?
