🎯 Уровень 1: Структура HTML
Ты оказался в пустом HTML-документе. Создай базовую структуру страницы:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Моя страница</title>
</head>
<body>
</body>
</html>
💡 Подсказка: Используй теги <h1> для заголовка и <p> для параграфа
🎨 Уровень 2: Стили CSS
Твоя страница выглядит скучно! Добавь стили, чтобы сделать её красивой:
h1 {
}
p {
margin: 20px;
}
Мой заголовок
Это параграф текста
⚡ Уровень 3: Магия JavaScript
Добавь интерактивности! Создай функцию, которая реагирует на клик:
const button = document.getElementById('myButton');
button.addEventListener('click', function() {
});
🔗 Уровень 4: Комбинированная атака
Создай полноценный интерактивный элемент:
<div class="counter">
<button id="decrease">-</button>
<span id="count">0</span>
<button id="increase">+</button>
</div>
<style>
.counter {
display: flex;
gap: 10px;
align-items: center;
}
</style>
<script>
let count = 0;
</script>
🏆
Поздравляем!
Ты успешно прошел квест!
Теперь ты вспомнил основы HTML, CSS и JavaScript.