Домашка 1

1. Внимательно прочитать раздаточный материал, если что-то в раздатке не понятно задавайте

вопросы в чат, на какие-то вопросы мы будем отвечать сразу, какие-то вопросы можно рассмотреть
на вебинаре, который будет в среду.

2. К следующему занятию вы должны потренироваться писать код в текстовом редакторе Sublime

Text. Для этого вам необходимо сверстать маленькую страничку, примерно также как мы это
делали на занятии. Внешний вид и содержание html-страницы произвольное.

Например, Вы можете сверстать страницу, в которой вы презентуете себя: кто вы, как вас зовут,
почему вы хотите научится верстать, где вы работаете, чем увлекаетесь, какую музыку слушаете,
какое кино смотрите, что за книги вы читаете и почему, разместите пару картинок о том, как вы
отдыхаете. В общем, это может быть совершенно любая информация.

На странице должны присутствовать:

• первоначальная разметка
• структурные тэги для разделения разных по смыслу блоков, достаточно использовать
только тег div (но по желанию можете также выделить шапку страницы при помощи тегов
<header></header> и подвал страницы тегами <footer></footer>).
Примечание: Шапкой html-страницы - называется ее верхняя часть (это примерно тоже самое что и верхний
колонтитул обычной страницы) , подвалом страницы называется ее нижняя часть ( это примерно тоже самое
что и нижний колонтитул обычной страницы).
• текстовые тэги:
• теги заголовков (минимум 3 уровня)
• теги <p> - для формирования абзацев текста
• теги <a> для ссылок
• +3 любых строчных тэга (например <b>, <span>, <em> и др. ) на выбор (можно
больше)
• списки:
• нумерованный (например, Ваш план обучения профессии программиста)
• ненумерованный (например, причины, почему вы решили стать программистом)
• хотя бы одна картинка (например, ваше лучшее фото)
• табличка, содержащая минимум 2 строки и 3 ячейки в каждой строке (например, о
любимых фильмах, книгах и музыке)
• тэги формы (попросите меня оставить отзыв о вас):
• поля для ввода логина, пароля и электронной почты,
• выпадающие списки (селекты)
• чекбоксы и радиобаттоны,
• область комментария,
• кнопка отправки формы.

Кроме того, нужно:

• вложить хотя бы несколько тэгов друг в друга (например в тег <p> вложить <em>, в тег
<div> вложить заголовок и несколько тегов <p>)
• заполнить атрибуты href (у ссылок) , alt, src ( у картинок)
 • задать классы для некоторых тэгов
• прописать стили для некоторых тэгов или классов

Внешний вид итоговой страницы - произвольный. Если не получится красиво расположить

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

Основная задача данной домашней работы, только в том, чтобы вы познакомились с основными
тегами и с некоторыми css-свойствами и попрактиковались в написании кода в Sublime Text

Дополнительная информация:

Желаю успехов!!!

Домашка 1 - усложненный вариант

Этот вариант не является обязательным, но для тех кто знаком с html и css и если есть желание
вы можете выполнить домашку в чуть более усложненном варианте:

Сверстать html страницу, содержимое которой может быть любым, но расположение элементов
должно быть аккуратным и примерно таким как в дизайн-макете hw_1.jpg Все остальные пункты
такие же как и в обычном варианте домашки.

Bootstrap не использовать!