создание сайта тур фирмы

header { background: #333; color: #fff; padding: 20px;}.logo { float: left; color: white;}Эти стили задают внешний вид заголовка страницы (шапки), включая цвет фона, цвет текста и отступы. .logo определяет стили для логотипа, который выравнивается слева и имеет белый цвет текста.li { display: inline-block; margin-left: 70px;}li a.button, #combinedButton, #knopka { display: inline-block; padding: 10px 30px; background-color: #333; color: #fff; text-decoration: none; transition: background-color 0.9s ease; border-radius: 5px; border: none;cursor: pointer;}Эти правила определяют стили для кнопок на странице. Они имеют определенные отступы, цвета, размеры, радиус скругления и стили при наведении мыши.footer { background: #333; position: relative; color: #fff; padding: 20px 0; text-align: center;}Эти стили определяют внешний вид футера страницы.Общий эффект CSS стилей - создание привлекательного и современного дизайна веб-страницы с использованием заданных цветов, отступов, размеров и эффектов.2.4 Работа сайтаПроверим работоспособность сайта.Рисунок 5 Стартовая страница сайтаВведем данные для бронирования:Рисунок 6 Бронирование тураЕсли телефон введен не корректно, то выводим ошибку.Рисунок 7 Ошибка не верный номер телефонаЕсли email не верно введен, то выводим ошибку.Рисунок 8Ошибка не верный номер телефонаПроверка отправки формы реализована через JavaScript, код программы в файле js.jsКодпрограммы:function handleFormSubmission(event) {event.preventDefault();constnameInput = document.getElementById('name');constemailInput = document.getElementById('email');constphoneNumberInput = document.getElementById('number');consttourInput = document.getElementById('tour');const name = nameInput.value.trim();const email = emailInput.value.trim();constphoneNumber = phoneNumberInput.value.trim();consttour = tourInput.value; // Проверка на наличие данных во всех обязательных поляхif (!name || !email || !phoneNumber || !tour) {alert('Пожалуйста, заполните все обязательные поля.');returnfalse; } // Проверка на наличие букв в номере телефонаif(!/^\d+$/.test(phoneNumber)) {alert('Номер телефона должен содержать только цифры.');returnfalse; } // Проверка на количество символовif (phoneNumber.length !== 11) {alert('Номер телефона должен состоять из 11 цифр.');return false; } // Проверка email if (!isValidEmail(email)) {alert('Пожалуйста, введитекорректный email.');return false; }console.log("Booking Details:");console.log("Name:", name);console.log("Email:", email);console.log("Phone Number:", phoneNumber);console.log("Selected Tour:", tour);bookingForm.reset();window.open("site2.html", "site.html");}function isValidEmail(email) { return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);}const slider = document.getElementById('slider');const images = slider.querySelectorAll('img');let currentIndex = 0;function showImage(index) { for (let i = 0; i < images.length; i++) { if (i === index) { images[i].style.display = 'block'; } else { images[i].style.display = 'none';} }}Если форма заполнена корректно:Рисунок 9 Корректно заполненная формаЗаполняем количество человек и длительность тура и рассчитываем цену тура.Расчёт реализован с помощью JavaScript, код программы в файле js2.jsКод программы:function calculatePrice() {var people = document.getElementById('people').value;var duration = document.getElementById('duration').value;varpricePerPersonPerDay = 100; // Цена за одного человека в деньvartotalPrice = pricePerPersonPerDay * people * duration;document.getElementById('price').innerHTML = 'Итого: $' + totalPrice;}ЗаключениеВ современном мире интернет стал неотъемлемой частью нашей жизни, и для туристических компаний иметь качественный и привлекательный веб-сайт стало обязательным. Наш проект по созданию сайта для турфирмы демонстрирует наши навыки в области веб-разработкиВ создании веб-сайта для турфирмы были использованы HTML, CSS и JavaScript:HTML (HyperTextMarkupLanguage):HTML был использован для структурирования контента веб-страницы. С его помощью были созданы различные элементы, такие как заголовки, параграфы, списки, ссылки, изображения и формы бронирования туров. HTML является основным языком разметки веб-страниц и предоставляет базовую структуру для отображения контента.CSS (CascadingStyleSheets):CSS был использован для стилизации и оформления внешнего вида веб-страницы. С его помощью были заданы цвета, шрифты, отступы, рамки, анимации и другие визуальные свойства элементов. CSS позволяет создавать привлекательный и современный дизайн сайта, делая его более привлекательным для пользователей.JavaScript:JavaScript был использован для добавления интерактивности и динамического поведения на веб-странице. С его помощью были реализованы различные функциональности, такие как анимации слайдера, проверка введенных данных в форме бронирования, обработка событий нажатия кнопок и отправка данных на сервер. JavaScript позволяет создавать более функциональные и интерактивные веб-приложения, обогащая пользовательский опыт.Таким образом, использование HTML, CSS и JavaScript в создании веб-сайта для турфирмы позволило создать привлекательный и функциональный онлайн-ресурс.В ходе работы были выполненные все поставленные задачи: проведен анализ литературных источников по теме туризм и создание сайтов, проведен анализ существующих веб-сайтов туристических компаний, разработана структура сайта, создан и протестировансайт.Список использованной литературыДакетт, Джон Основы веб-программирования с использованием HTML, XHTML и CSS / Джон Дакетт. - М.: Эксмо, 2019. - 768 c.Квинт, Игорь Создаем сайты с помощью HTML, XHTML и CSS на 100% / Игорь Квинт. - М.: Книга по Требованию, 2020. - 448 c.Левин М.П., Алексеев Ю.М. 2 в 1: Самоучитель разработки Web-сайтов: HTML, CSS, графика, анимация, раскрутка + Видеокурс – М.: Триумф, 2021. – 397 с.Петюшкин, Алексей HTML в Web-дизайне / Алексей Петюшкин. - М.: БХВ-Петербург, 2021. - 400 c.Прохоренок, Н. HTML, JavaScript, PHP и MySQL. Джентльменский набор Web-мастера / Н. Прохоренок. - М.: БХВ-Петербург, 2019. - 912 c.Хольцшлаг М. 250 секретов HTML и Web-дизайна. – М.: NT Press, 2006. – 490 с.Хольцшлаг М.Э. Языки HTML и CSS: для создания Web-сайтов: офиц. учеб. курс. Учебное пособие. – М.: Изд-во Триумф, 2021. – 303 с.Дунаев, Вадим HTML, скрипты и стили / Вадим Дунаев. - М.: Книга по Требованию, 2021. - 427 c.Ллойд, Йен Создай свой веб-сайт с помощью HTML и CSS / Йен Ллойд. - М.: Питер, 2019. - 401 c.Лазаро, Исси Коэн Полный справочник по HTML, CSS и JavaScript / ЛазароИсси Коэн, Джозеф Исси Коэн. - М.: ЭКОМ Паблишерз, 2020. - 938 c.