Создание страницы с несколькими кнопками, которые меняют внешний вид, можно реализовать с помощью HTML, CSS и JavaScript. Давайте рассмотрим шаги, необходимые для этого.

Начнем с создания базовой структуры HTML. Мы создадим три кнопки и контейнер для содержимого страницы.

    
    
    
    


    
Выберите тему
    

        Тема 1
        Тема 2
        Тема 3
    
    

        
Это содержимое страницы, которое будет меняться в зависимости от выбранной темы.
    
    

Теперь создадим файл стилей (styles.css), в котором определим три разные темы для нашей страницы.

body {
    font-family: Arial, sans-serif;
}

#content {
    padding: 20px;
    border: 1px solid #ccc;
}

.theme1 {
    background-color: lightblue;
    color: darkblue;
}

.theme2 {
    background-color: lightgreen;
    color: darkgreen;
}

.theme3 {
    background-color: lightcoral;
    color: darkred;
}

Теперь создадим файл JavaScript (script.js), который будет обрабатывать нажатия кнопок и менять тему страницы.

document.getElementById('theme1').addEventListener('click', function() {
    document.body.className = 'theme1';
});

document.getElementById('theme2').addEventListener('click', function() {
    document.body.className = 'theme2';
});

document.getElementById('theme3').addEventListener('click', function() {
    document.body.className = 'theme3';
});

Теперь, когда у нас есть HTML, CSS и JavaScript, мы можем открыть файл HTML в браузере и протестировать функциональность. При нажатии на каждую из кнопок, внешний вид страницы должен изменяться в соответствии с выбранной темой.

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

Таким образом, вы создали страницу с несколькими кнопками, которые меняют внешний вид страницы в зависимости от выбора пользователя. Удачи в ваших дальнейших экспериментах с веб-разработкой!