Главная / Вопросы и ответы
Как сделать два дизайна на сайте?
Существует несколько способов создания двух дизайнов на сайте. Один из наиболее распространенных способов - использовать CSS для создания разных стилей для разных частей сайта. Для этого можно использовать классы или идентификаторы, которые будут применяться только к определенным элементам на странице.
Создайте два файла стилей для каждого дизайна, например style1.css и style2.css.
Вставьте в каждый файл соответствующие стили для нужных элементов страницы. Например:
css/* Дизайн 1 */ .header { background-color: blue; color: white; } .footer { background-color: blue; color: white; } /* Дизайн 2 */ .header { background-color: yellow; color: black; } .footer { background-color: yellow; color: black; } - В HTML-коде сайта укажите, какой файл стилей нужно использовать для каждой страницы, добавив ссылку на него в тег
<head>. Например:
html<head> <link rel="stylesheet" href="style1.css"> </head> - Для смены дизайна на другой можно использовать JavaScript. Например, можно добавить кнопки для выбора дизайна и при нажатии на кнопку менять файл стилей. Например:
html<button onclick="changeStyle('style1.css')">Дизайн 1</button> <button onclick="changeStyle('style2.css')">Дизайн 2</button> - Добавьте JavaScript-функцию, которая будет менять файл стилей при нажатии на кнопку. Например:
jsfunction changeStyle(sheet) { document.querySelector('link[href*="style"]').href = sheet; } Этот код найдет ссылку на файл стилей на странице и заменит ее на новую, переданную в функцию. Таким образом, при нажатии на кнопку, дизайн сайта будет меняться с помощью изменения файла стилей.
