Практика. Часть 8. Доверстали блок с отзывами | Курс Веб разработчик | Академия верстки

Автор Artur Merichev
Практика. Часть 8. Доверстали блок с отзывами | Курс Веб разработчик | Академия верстки

Привет.

На связи. Артем Исламов это. Академия верстки вы сейчас находитесь в плейлисте который называется web-разработчик 10 поток — это записи нашего закрытого курса мы их бесплатно в YouTube, но мы не выложили домашнее задание и дипломный проект от этого курса для того чтобы получить полный доступ ко всем домашка дипломом и так далее.

Вам необходимо перейти по ссылке в описании или вот там справа в углу будет значок информации.

Вы можете кинуть туда и перейти по ссылке, а затем вы оплачиваете полный доступ ко всем домашку дипломным проектом указывайте свою почту после этого получаете доступ полностью к записям курсы веб разработчик 1000 со всеми модулями со всеми заданиями дополнительными заданиями со всеми видео уроками которые здесь есть как мы обычно прикрепляем к каждому нашему уроку и дополнительные документы дополнительные материалы макеты дополнительные ссылки. Поэтому если вы хотите получить полный доступ ко всем записям и не ждать пока они выйдут на. Ютюбе Вы можете перейти по ссылке в описании и оплатить. Приятного просмотра этого урока. До скорой встречи. Всем привет на связи. Артём Исламов продолжаем изучать практическую сторону верстки мы остановились на том, что с версалем три по факту блока. Т4 блок с отзывами. Мы ещё не до версаля. Но сегодня. Мы — это сделаем мы читаем эту контактную форму у этого блока. Северсталь вот эту картинку руки адаптируем этот блок для мобильных устройств. Ну и остальные блоки такие как схема работы и всё на 100% включено мы совершаем следующем уроке они вырастают свою нелегко, что у нас осталось у нас сверстан на данный. Слайдер и осталась верстать в эту форму, но когда я сегодня съел записывать этот урок. Я заметил за собой очень неприятную ошибку — это не ошибка — это просто не недосмотренный так скажу я недоглядел, что формы и инпуты уточни Input и. Эллы в формах очень сильно похожа прямо очень похожее то есть они выполнены в одном ампере где-то они расположены вертикально где-то горизонтально. А я когда оформлял эти. Так скажем инпуты я оформила только в mainform то есть мы здесь в стилях прописали mainform и главную форму оформили с полями для ввода нам нужно немножко поправить сейчас я — это сделаю и поля для ввода. Я в стилях вырезаю. Так ну и собственно кнопка отправить. Да у нас тоже. Давайте вырежем Control X и придём просто вот здесь типографика напишем, что оформление форм и здесь мы вставим слова форма точнее класс форм и в нём будет находиться Class form Input form Label и уточнил внутри классов и кнопка Home Button. Я теперь у нас все кнопки все поля будут в формах везде одинаковые только нужно поправить разметку в самом начале у нас находится mainform находим этот mainform и mainform мы меняем на просто форм во-первых у самой формы класс будет форум то есть мы добавляем его не было добавляем и здесь мы делаем form Input то есть. Мы отменяем на form Input in form меняем просто. На понт. Бпан сейчас ничего не должна измениться. Да ничего не изменилось. Как мы видим, но в будущем когда применять импульсы они будут сразу выстраиваться так как нам надо. Ну вот — это такая такое маленькое замечание обратить внимание такие оплошности будут возникать сплошь и рядом, но со временем вы наберете руку и на тренируйте глаз без проблем сможете определяется такие мелочи. То есть перед перед верстка макета вы будете вы только цветовое повторяющиеся элементы такие как формы какие-то повторяющиеся объекты и так далее и так у нас есть. Фурман как мы видим по сетке она занимает не всю ширину занимает только раз два три четыре пять шесть семь восемь колонок. Поэтому нам нужно создать новый ролл в котором будет кол md-8 вступаем в 2 то есть по краям по два оставляем и так у нас есть Feed Back Slider. Я его вот здесь у нас заканчивается питбайк слайдер — это нужно для того чтобы не запутались и дальше идёт Feedback form Feedback form отлично здесь у нас будет идти роутер наоборот на сложно найти новый в котором будет Feedback form чтобы не запутаться так внутри Row vertical md-8 AMD a58. Овна и можно будет Feedback form. Вот такая вот простая математика. Так стоп пропустили значок у нас получилось наверное влажность вот так нашей форме будет заголовок этой формы и сама форма заголовок у нас будет 3 уровня здесь идёт второго уровня. Поэтому будет 3 уровня заголовок — это текст в этой форме хотите также. Оставьте ваши контактные я скопирую этой этот текст из Photoshop с копируем ставим и после Fit Beckham David Beckham has become здесь после этого заголовка будет идти Same form form Action пустой. Мы помним, что в форме должен быть класс форум. Ну и верстать мы — это заново не будем писать потому, что здесь уже есть готовая форма наша. Вот она всё, что находится внутри формы мы выделяем копируем. Кроме текста права подарок на день рождения прощения потому, что здесь нет этим мы проставляем — это вот таким вот образом отлично. И кстати у нас здесь form Input form Input. А здесь класс форма этого всплывающем окне на всякий случай если неправильно поставить информацию. Мы сюда копировали. Нужно будет исправить на форум — это вот таким образом чтобы модальном окне тоже было всё в порядке хорошо и так у нас есть форма так здесь не запутаться сейчас в делах закрывающих давайте рассмотрим отлично здесь у нас будет заканчиваться фитоклон всё. Теперь точно не запутаешься и так у нас здесь ваше имя ваш номер телефона, но посмотрим, что там в макете у нас происходит форму получилось так у нас что-то уехала col-md-offset. Не 82. Прошу прощения формулы вот форма как надо выглядеть. Единственное, что с подливой бы немножечко не так выглядит форма. Как нам на.

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

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