🖥️ Домашнее задание 1. Основы вёрстки.

🚀 Инструкция

1. Клонирование репозитория:

git clone https://github.com/MeShootIn/html-css-basics-MeShootIn.git
cd html-css-basics-MeShootIn

2. Установка всех зависимостей:

• через npm:

npm install

• или через yarn:

yarn install

3. Компиляция SCSS в CSS:

sass --no-error-css --stop-on-error --style=compressed styles/scss:styles/css

4. Запуск локального сервера:

• через npm:

npm live-server --port=0 --host=0.0.0.0

• через yarn:

yarn live-server --port=0 --host=0.0.0.0

📋 Условия

☝️ Обязательно

1. Создать index.html и style.css
2. Добавить в index.html минимальную разметку для html5 документа
3. Подключить файл стилей style.css в index.html
4. Сверстать статью, содержащую:

• Несколько заголовков разного уровня
• Несколько параграфов текста, в которых есть жирный, курсивный, подчеркнутый текст
• Маркированный список
• Нумерованный список
• Несколько изображений разных размеров
• Цитату
• Надстрочный текст
• Подстрочный текст
• Ссылку на другой сайт, открывающуюся в новой вкладке
• Таблицу из нескольких колонок (в таблице есть caption и thead)
• В конце статьи форму обратной связи "Оставьте отзыв о статье" (нужные поля продумайте самостоятельно)
• Отправку данных с формы реализовывать не нужно =)

👍 Дополнительно

5. Сделать отступ первой строки у каждого абзаца текста (красная строка)
6. Добавить рамку у одного из изображений
7. Ограничить ширину статьи 900px
8. Выровнять статью по центру экрана (по горизонтали)
9. Сделать точки у маркированного списка красными с помощью псевдоэлементов (прочитать про всевдоэлементы ::before, ::after)

🧪 Критерии приёмки

• ДЗ без выполненного пункта "дополнительно" оценивается максимально в 80 баллов
• открытие ссылки в другой вкладке - без js
• жирный, курсивный и подчеркнутый текст - без css
• использовать специализированные теги