Загрузка данных

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Смена цвета текста</title>

    <link rel="stylesheet" href="style.css">
</head>
<body>

    <h1 id="title">Пример заголовка</h1>

    <button class="red" onclick="changeColor('red')">
        Красный
    </button>

    <button class="green" onclick="changeColor('green')">
        Зелёный
    </button>

    <button class="blue" onclick="changeColor('blue')">
        Синий
    </button>

    <script src="script.js"></script>
</body>
</html>





body {
    text-align: center;
    margin-top: 50px;
    font-family: Arial, sans-serif;
}

h1 {
    transition: 0.3s;
}

button {
    padding: 10px 20px;
    margin: 5px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    color: white;
    font-size: 16px;
}

.red {
    background-color: red;
}

.green {
    background-color: green;
}

.blue {
    background-color: blue;
}





function changeColor(color) {
    document.getElementById("title").style.color = color;
}