BananaMaster

4 Как использовать CSS в HTML: пошаговое руководство - ( HTML and CSS, Front End )

Если что то забыли кликни для перехода на урок

📘 Практических задач по CSS стилям

Для каждой задачи создай отдельный класс в файле style.css и примени его к нужному HTML тегу.

📌 Структура файлов: index.html + style.css

✏️ Задача 1

Повтори внешний вид этого текста:

Hello World

• Цвет текста: red
• Размер шрифта: 20px

✏️ Задача 2

Повтори внешний вид этого текста:

My Name

• Цвет текста: #2bcd84
• Жирность: 700

✏️ Задача 3

Повтори внешний вид этого текста:

I love coding

• Шрифт: "Courier New", Courier, monospace
• Размер шрифта: 24px
• Цвет текста: #f0a830

✏️ Задача 4

Повтори внешний вид этого текста:

Frontend Developer

• Цвет текста: blue
• Размер шрифта: 34px
• Жирность: 300

✏️ Задача 5

Повтори внешний вид этого текста:

CSS is cool

• Цвет текста: #5bc4f5
• Шрифт: Georgia, serif
• Размер шрифта: 20px

✏️ Задача 6

Повтори внешний вид этого текста:

JavaScript

• Цвет текста: white
• Размер шрифта: 18px
• Жирность: 600

✏️ Задача 7

Повтори внешний вид этого текста:

Rockstar Games

• Цвет текста: #ff6b6b
• Размер шрифта: 50px
• Шрифт: "Courier New", Courier, monospace
• Жирность: 900

✏️ Задача 8

Повтори внешний вид этого текста:

Small and light

• Цвет текста: #888
• Размер шрифта: 15px
• Жирность: 100

✏️ Задача 9

Повтори внешний вид этого текста:

GTA 6 is coming

• Цвет текста: #b89ef8
• Шрифт: Impact, fantasy
• Размер шрифта: 36px
• Жирность: 400

✏️ Задача 10 — 🔥 Бонус

Придумай сам! Создай класс .my-style и примени его к любому тегу.

Text

• Выбери свой цвет текста
• Выбери свой размер шрифта
• Выбери свою жирность
• Выбери свой шрифт

📌 Важно:
Каждый класс пишется отдельно в style.css.
Используйте только HTML и CSS.
JavaScript использовать не нужно.
Практикуйте свойства: color, font-size, font-weight, font-family.