Проект разнорабочие52.рф ч4 [Разработка сайта с нуля]

Автор Andrei Golubev
Проект разнорабочие52.рф ч4 [Разработка сайта с нуля]

Так ну, что друзья пришло время.

Нам начать уже именно верстать. Именно натягивать или наш каркасе в данном случае я ещё сделала маленькую фишек. Я вырезал одно большое изображение нашего макета подставил его на фоновое изображение теперь мы будем делать pixel-perfect верстку от которой будет кайфово каждый.

Кто причастен данного макету клиент дизайнер руководитель я.

Я выступаю прямо решатели всех проблем соответственно я должен делать всё идеально максимально точно как в макете. Итак приступим для начала мы сделаем шапочку шапку сразу сделаем фиксированной так как у нас она будет плавать если она будет нефиксированная — это может бы убрать пока не будем выделываться fixed-top 00 так далее покрасим её в какой-то яркий красный цвет допустим по макету насси текста белая поэтому сразу поставим Color белый цвет дали. У нас есть proma есть. В центральной части контакт. Научись всё, что нам необходимо — это найти шрифт узнать шрифт и размер — это ролевые симбол 14 пикселей и проверим себя 1426 и так промо значит он 14 пикселей. Ермоловой фото на 6 минут и так далее. У нас. Центральная часть — это ссылочка наша насколько. Мы помним ссылка. Это плохо пробовал также Color CSS Font 1832 пиксели плохо пробовал. Прошу прощения так и далее. У нас суточные без видео процент прозрачности белого цвета Lite 1632 так и пишет минимально как открываемся уходим минимальная минимальный. Уход от реального дизайна дабы не было нас дальнейшем никаких проблем из спичек с дизайнером потому, что он натворил эту красоту и мы должны под него подстраиваться под него сделать верстку чтобы в первую очередь ему — это понравилось если ему понравится то. Клиент будет доволен 100% так и тут мы должны написать кола-рыба канале — это 205 85 05 так. Центральная часть также у нас сразу нашем кабинете контентная часть контактная часть — это текст по правому краю. Но — это возможно будет уже лично. Так как у нас сейчас эти будут мешаться таком Probox 20-30 копируем стиль 20-30. Цвет ссылочки тоже копирование переведется соответственно будет какой-то синей стандартный далее заказать бесплатный звонок мы видим 1632 ли коралловые. Мы же использовали и 32 в принципе OK так. А — это чья. Карта ада. У нас есть пацанчик и нас есть шрифты. Дайте сразу оформим 1 блок красиво adalya буду. Просто накидывать накидывать потом будем оформляться. Так мы едем в залог болтовые 4466 так и. Дилан клиболд находим 607 болт зоология. Закидаем 4466. Так ну и соответственно тоже белый цвет поставим сразу Java Color эфир можно написать шесть шесть символов которые означает белый цвет, но мы экономим каждое место соответственно упростите запись трёхзначного доля 1832 цена warlight — это у нас H2. О'кей 18 32 Lite есть доля. У нас есть вспышка пупырышки также 1830. А у телефона лохом болт 50 30 минут оружием то готова. Ну ещё мы забыли добавить маленькую книжечку — это фоновое изображение нашего главного экрана абганерово видимо она с закруглением поэтому также вырезаем либо же накладываем какие-то смарт-объект эффекты именно наверное не всегда получится сделать идеальное. При таком раскладе можем также сделать через различные canvas, но пока не будем внедрять. Эти подробности. Наша задача сделать максимально просто максимально удобно минимальные затраты максимальный эффект у нас. Адская верстка. Поэтому извините так сразу определим, что высота 750 чтобы у нас не было никаких приколов потом дальнейшем вот так. Ну в принципе можем проверить, что у нас получается прекрасно. Если мы уберем наши творчество по нас получается. Вот такая вот прикольная картинка что-то. Похоже уже на правду включаем снова wrapper и поехали дальше. Так теперь можем либо же приступать к аккуратно натяжки всех этих уроков — перейти к следующему как я пообещал давайте мы сейчас оформим именно блок прям чётко чётко, а дальше будем уже работать так как я всегда работаю. Итак приступим. У нас есть отступы на этом экране на экране шапочка. Ну приблизительно 30 пикселей так и поставим паддингтон 1 3000 хотя бы 20 поста сразу по 2 немнок залог, а потом придём к шапке мы видим мы попали идеально попали в который предложил нам дизайнер в макете поэтому мы от них не должны отходить максимально стараться приближенными быть парочку пикселя Ranger рождения не чему не приведёт кроме как. Просто я хочу или клиенту так очень понравилась я не настаиваю ни мы должны сделать идеальную русский поэтому pixel-perfect в этом нам помогает. Прекрасное далёко нас H2 есть также. Маржан какой-то ботам 25 допустим так и от п нас также есть доступ в районе 10. Посмотрите 12 кажется прекрасным Solaris нам ещё видимо одна фишка у нас текст. Вот наши тексты заканчивается, а должен немножко дальше и сразу берём вот этот проклятый подчёркивание ходят decorating номер так и ещё момент мне сейчас проверим. Есть ли какие-то Hover эффектно данных об телефон волне контент нет поэтому мы как. Крутые разрабы мы должны придумать будем какой-то эффект банально покраска цветом либо что-то ещё интересное опять всё на этот от шлифовки нашего края теперь пацанчик. Мы видим, что пацанчик немножко стоит, но совсем не ровно соответственно мы должны обратиться к нему и его двигать есть такой прекрасный класс N 1 1000 — 10.000. И теперь мы должны работать именно данными манипуляциями данными свойствами, тогда бы его подвинуть так как есть макете, но оставим. Пока так и теперь мы видим, что мы работаем с отрицательными значениями — это нехорошо, но этот дизайн поэтому мы ничего не можем поделать кроме как.

0 комментариев
0

Читайте также