Проект: HTML формы

Взгляните на Mint.com: простая и удобная навигация, яркий красочный дизайн, сайт выглядит просто отлично! В данном проекте вам нужно будет с нуля создать форму регистрации пользователей, взяв форму с Mint.com за основу.

Страница очень простая, поэтому, даже если ваши знания CSS не совершенны, у вас должно получиться её скопировать. Можете не беспокоиться о динамической составляющей, поиск подходящих иконок и отправка данных с формы также необязательны. Цель этого задания - сделать вашу страницу максимально похожей на исходную.

Шаги к победе

  1. Взгляните на страницу регистрации mint.com, форма на которой не столь сложна.
  2. Следуйте инструкциям на странице проекта "google homepage" чтобы настроить репозиторий для своего проекта (не забудьте сменить название на собственное).
  3. Создайте пустой HTML документ.
  4. Спланируйте, как будут расположены относительно друг друга элементы страницы.
  5. Разметьте пустые <div>'ы для большинства разделов (форма, боковая панель, footer..), сделайте их нужного размера, настройте выравнивание. Для большей наглядности, при позиционировании элементов желательно поменять цвет фона каждого из них. Также не забывайте использовать инструменты разработчика в вашем браузере (правый клик на страницу, "Исследовать элемент")!
  6. Заполните каждый <div> соответствующим контентом.
  7. Теперь оформите это как исходную страницу.
  8. Запушьте ваше решение на Github, вы восхитительны!

Решения других студентов

Поделиться уроком: