ПИБД - 21 Басалов А.Д. Вторая Лабораторная Работа #2
@@ -2,20 +2,52 @@
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Штурмовой факультет - ЭГПУ</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Штурмовой факультет</title>
|
||||
<link rel="stylesheet" href="style.css"/>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Штурмовой факультет</h1>
|
||||
<img src="StormTrooperPoster.jpg" alt="Штурмовой факультет">
|
||||
|
||||
<h2>О факультете</h2>
|
||||
<p>Здесь будет описание штурмового факультета.</p>
|
||||
|
||||
<h2>Программа обучения</h2>
|
||||
<p>Здесь будет информация о программе обучения.</p>
|
||||
|
||||
<p><a href="faculties.html">К списку факультетов</a></p>
|
||||
<p><a href="index.html">На главную</a></p>
|
||||
<div class="wrapper">
|
||||
<!-- Header -->
|
||||
<header class="header">
|
||||
<!-- Логотип и название -->
|
||||
<div class="header-top">
|
||||
<img src="logo.png" alt="Логотип университета" class="logo">
|
||||
<div class="header-text">
|
||||
<h1>Эркутский Государственный Педагогический Университет</h1>
|
||||
<p>Здесь могла быть ваша реклама</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Navbar -->
|
||||
<nav class="navbar">
|
||||
<a href="index.html">Главная</a>
|
||||
<!-- Dropdown для "Факультеты" -->
|
||||
<div class="dropdown">
|
||||
<a href="faculties.html" class="dropbtn">Факультеты</a>
|
||||
<div class="dropdown-content">
|
||||
<a href="StormtrooperFaculty.html">Штурмовой факультет</a>
|
||||
<a href="WorkerFaculty.html">Рабочий факультет</a>
|
||||
</div>
|
||||
</div>
|
||||
<a href="news.html">Новости</a>
|
||||
<a href="contacts.html">Контакты</a>
|
||||
<a href="admissions.html">Приемная комиссия</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- Content -->
|
||||
<main class="content">
|
||||
<h2>Штурмовой факультет</h2>
|
||||
<p>Тут будет распологаться информация об элитном штуромовом корпусе ЭГПУ</p>
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<p>© 2023 Эркутский Государственный Педагогический Университет. Все права защищены.</p>
|
||||
<a href="https://vkvideo.ru/video-79153897_456239331" target="_blank" class="corner-image">
|
||||
<img src="VKlogo.png" alt="Перейти на страницу">
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -2,21 +2,52 @@
|
||||
<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">
|
||||
<link rel="stylesheet" href="style.css"/>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Контакты</h1>
|
||||
|
||||
<h2>Адрес</h2>
|
||||
<p>г. Эркутск, ул. Университетская, 1</p>
|
||||
|
||||
<h2>Телефон</h2>
|
||||
<p>+7 (123) 456-78-90</p>
|
||||
|
||||
<h2>Email</h2>
|
||||
<p>info@egpu.ru</p>
|
||||
|
||||
<p><a href="index.html">На главную</a></p>
|
||||
<div class="wrapper">
|
||||
<!-- Header -->
|
||||
<header class="header">
|
||||
<!-- Логотип и название -->
|
||||
<div class="header-top">
|
||||
<img src="logo.png" alt="Логотип университета" class="logo">
|
||||
<div class="header-text">
|
||||
<h1>Эркутский Государственный Педагогический Университет</h1>
|
||||
<p>Здесь могла быть ваша реклама</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Navbar -->
|
||||
<nav class="navbar">
|
||||
<a href="index.html">Главная</a>
|
||||
<!-- Dropdown для "Факультеты" -->
|
||||
<div class="dropdown">
|
||||
<a href="faculties.html" class="dropbtn">Факультеты</a>
|
||||
<div class="dropdown-content">
|
||||
<a href="StormtrooperFaculty.html">Штурмовой факультет</a>
|
||||
<a href="WorkerFaculty.html">Рабочий факультет</a>
|
||||
</div>
|
||||
</div>
|
||||
<a href="news.html">Новости</a>
|
||||
<a href="contacts.html">Контакты</a>
|
||||
<a href="admissions.html">Приемная комиссия</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- Content -->
|
||||
<main class="content">
|
||||
<h2>Тут будут распологаться контакты нашего университета</h2>
|
||||
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<p>© 2023 Эркутский Государственный Педагогический Университет. Все права защищены.</p>
|
||||
<a href="https://vkvideo.ru/video-79153897_456239331" target="_blank" class="corner-image">
|
||||
<img src="VKlogo.png" alt="Перейти на страницу">
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -2,20 +2,65 @@
|
||||
<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">
|
||||
<link rel="stylesheet" href="style.css"/>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Факультеты ЭГПУ</h1>
|
||||
|
||||
<h2>Штурмовой факультет</h2>
|
||||
<img src="StormTrooperPoster.jpg" alt="Штурмовой факультет" class="faculty-image">
|
||||
<p><a href="StormtrooperFaculty.html">Подробнее о факультете</a></p>
|
||||
|
||||
<h2>Рабочий факультет</h2>
|
||||
<img src="WorkerPoster.jpg" alt="Рабочий факультет" class="faculty-image">
|
||||
<p><a href="WorkerFaculty.html">Подробнее о факультете</a></p>
|
||||
|
||||
<p><a href="index.html">На главную</a></p>
|
||||
<div class="wrapper">
|
||||
<!-- Header -->
|
||||
<header class="header">
|
||||
<!-- Логотип и название -->
|
||||
<div class="header-top">
|
||||
<img src="logo.png" alt="Логотип университета" class="logo">
|
||||
<div class="header-text">
|
||||
<h1>Эркутский Государственный Педагогический Университет</h1>
|
||||
<p>Здесь могла быть ваша реклама</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Navbar -->
|
||||
<nav class="navbar">
|
||||
<a href="index.html">Главная</a>
|
||||
<!-- Dropdown для "Факультеты" -->
|
||||
<div class="dropdown">
|
||||
<a href="faculties.html" class="dropbtn">Факультеты</a>
|
||||
<div class="dropdown-content">
|
||||
<a href="StormtrooperFaculty.html">Штурмовой факультет</a>
|
||||
<a href="WorkerFaculty.html">Рабочий факультет</a>
|
||||
</div>
|
||||
</div>
|
||||
<a href="news.html">Новости</a>
|
||||
<a href="contacts.html">Контакты</a>
|
||||
<a href="admissions.html">Приемная комиссия</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- Content -->
|
||||
<main class="content">
|
||||
<h2>Факультеты ЭГПУ</h2>
|
||||
<p>Мы предлагаем студентам пускай и не широкий но зато по-настоящему разнообразный спектр факултетов!</p>
|
||||
<div class="faculties-grid">
|
||||
<!-- Фотография 1 -->
|
||||
<a href="StormtrooperFaculty.html" class="faculty-link">
|
||||
<img src="StormTrooperPoster.jpg" alt="Штурмовой факультет" class="faculty-image">
|
||||
<p>Штурмовой факультет</p>
|
||||
</a>
|
||||
|
||||
<!-- Фотография 2 -->
|
||||
<a href="WorkerFaculty.html" class="faculty-link">
|
||||
<img src="WorkerPoster.jpg" alt="Рабочий факультет" class="faculty-image">
|
||||
<p>Рабочий факультет</p>
|
||||
</a>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<p>© 2023 Эркутский Государственный Педагогический Университет. Все права защищены.</p>
|
||||
<a href="https://vkvideo.ru/video-79153897_456239331" target="_blank" class="corner-image">
|
||||
<img src="VKlogo.png" alt="Перейти на страницу">
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
60
index.html
60
index.html
@@ -2,21 +2,53 @@
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Главная - ЭГПУ</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Главная страница - ЭГПУ</title>
|
||||
<link rel="stylesheet" href="style.css"/>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Эркутский Государственный Педагогический Университет</h1>
|
||||
|
||||
<h2>Добро пожаловать в ЭГПУ</h2>
|
||||
<p>Самый престижный университет Эркутска приглашает студентов!</p>
|
||||
|
||||
<h3>Наши факультеты:</h3>
|
||||
<ul>
|
||||
<li><a href="StormtrooperFaculty.html">Штурмовой факультет</a></li>
|
||||
<li><a href="WorkerFaculty.html">Рабочий факультет</a></li>
|
||||
</ul>
|
||||
|
||||
<p><a href="contacts.html">Контактная информация</a></p>
|
||||
<div class="wrapper">
|
||||
<!-- Header -->
|
||||
<header class="header">
|
||||
<!-- Логотип и название -->
|
||||
<div class="header-top">
|
||||
<img src="logo.png" alt="Логотип университета" class="logo">
|
||||
<div class="header-text">
|
||||
<h1>Эркутский Государственный Педагогический Университет</h1>
|
||||
<p>Здесь могла быть ваша реклама</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Navbar -->
|
||||
<nav class="navbar">
|
||||
<a href="index.html">Главная</a>
|
||||
<!-- Dropdown для "Факультеты" -->
|
||||
<div class="dropdown">
|
||||
<a href="faculties.html" class="dropbtn">Факультеты</a>
|
||||
<div class="dropdown-content">
|
||||
<a href="StormtrooperFaculty.html">Штурмовой факультет</a>
|
||||
<a href="WorkerFaculty.html">Рабочий факультет</a>
|
||||
</div>
|
||||
</div>
|
||||
<a href="news.html">Новости</a>
|
||||
<a href="contacts.html">Контакты</a>
|
||||
<a href="admissions.html">Приемная комиссия</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- Content -->
|
||||
<main class="content">
|
||||
<h2>Добро пожаловать в ЭГПУ</h2>
|
||||
<p>Самый престижный университет Эркутска - ЭГПУ приглашает присоединиться к команде неучей и их студентов!</p>
|
||||
<p>Мы предлагаем обучение только на платной основе, ведь дорого - значит престижно!</p>
|
||||
<p>Подробности о поступлении вы можете узнать тут: <a href="admissions.html">Приемная комиссия</a></p>
|
||||
</main>
|
||||
|
||||
<footer class="footer">
|
||||
<p>© 2023 Эркутский Государственный Педагогический Университет. Все права защищены.</p>
|
||||
<a href="https://vkvideo.ru/video-79153897_456239331" target="_blank" class="corner-image">
|
||||
<img src="VKlogo.png" alt="Перейти на страницу">
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
53
news.html
Normal file
53
news.html
Normal file
@@ -0,0 +1,53 @@
|
||||
<!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>
|
||||
<div class="wrapper">
|
||||
<!-- Header -->
|
||||
<header class="header">
|
||||
<!-- Логотип и название -->
|
||||
<div class="header-top">
|
||||
<img src="logo.png" alt="Логотип университета" class="logo">
|
||||
<div class="header-text">
|
||||
<h1>Эркутский Государственный Педагогический Университет</h1>
|
||||
<p>Здесь могла быть ваша реклама</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Navbar -->
|
||||
<nav class="navbar">
|
||||
<a href="index.html">Главная</a>
|
||||
<!-- Dropdown для "Факультеты" -->
|
||||
<div class="dropdown">
|
||||
<a href="faculties.html" class="dropbtn">Факультеты</a>
|
||||
<div class="dropdown-content">
|
||||
<a href="StormtrooperFaculty.html">Штурмовой факультет</a>
|
||||
<a href="WorkerFaculty.html">Рабочий факультет</a>
|
||||
</div>
|
||||
</div>
|
||||
<a href="news.html">Новости</a>
|
||||
<a href="contacts.html">Контакты</a>
|
||||
<a href="admissions.html">Приемная комиссия</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- Content -->
|
||||
<main class="content">
|
||||
<h2>Тут будет распологаться информация с новостями</h2>
|
||||
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<p>© 2023 Эркутский Государственный Педагогический Университет. Все права защищены.</p>
|
||||
<a href="https://vkvideo.ru/video-79153897_456239331" target="_blank" class="corner-image">
|
||||
<img src="VKlogo.png" alt="Перейти на страницу">
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
238
style.css
238
style.css
@@ -1,29 +1,241 @@
|
||||
/* Общие стили для всех устройств */
|
||||
html,
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
margin: 20px;
|
||||
line-height: 1.6;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
min-height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
/* Шапка */
|
||||
.header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
background-color: #f8f9fa;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.header-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 80px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.header-text {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.header-text h1 {
|
||||
margin: 0;
|
||||
font-size: 1.5rem;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
h1, h2 {
|
||||
color: #0066cc;
|
||||
.header-text p {
|
||||
margin: 5px 0 0;
|
||||
font-size: 0.9rem;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #0066cc;
|
||||
/* Навигация */
|
||||
.navbar {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
background-color: #333;
|
||||
padding: 10px 0;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.navbar a {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font-size: 1rem;
|
||||
padding: 5px 10px;
|
||||
transition: background-color 0.3s ease;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
.navbar a:hover {
|
||||
background-color: #555;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
/* Выпадающее меню */
|
||||
.dropdown {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.dropdown-content {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #444;
|
||||
min-width: 160px;
|
||||
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
|
||||
z-index: 1;
|
||||
border-radius: 5px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.dropdown-content a {
|
||||
color: #fff;
|
||||
padding: 12px 16px;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.dropdown-content a:hover {
|
||||
background-color: #555;
|
||||
}
|
||||
|
||||
.dropdown:hover .dropdown-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Основной контент */
|
||||
.content {
|
||||
width: 40%;
|
||||
flex: 1 1 auto;
|
||||
margin: 20px auto;
|
||||
padding: 20px;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/* Стили для подвала */
|
||||
.footer {
|
||||
position: relative; /* Делаем подвал относительным контейнером */
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
margin-top: 20px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
/* Стили для картинки в правом нижнем углу подвала */
|
||||
.corner-image {
|
||||
position: absolute; /* Абсолютное позиционирование внутри footer */
|
||||
bottom: 10px; /* Отступ снизу внутри footer */
|
||||
right: 10px; /* Отступ справа внутри footer */
|
||||
z-index: 1000; /* Чтобы картинка была поверх других элементов */
|
||||
transition: transform 0.3s ease; /* Плавное увеличение при наведении */
|
||||
}
|
||||
|
||||
.corner-image img {
|
||||
width: 60px; /* Размер картинки */
|
||||
height: 50px;
|
||||
border-radius: 50%; /* Круглая картинка (опционально) */
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Тень */
|
||||
}
|
||||
|
||||
.corner-image:hover {
|
||||
transform: scale(1.1); /* Увеличение при наведении */
|
||||
}
|
||||
|
||||
/* Стили для контейнера с фотографиями факультетов */
|
||||
.faculties-grid {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
/* Стили для ссылки с фотографией */
|
||||
.faculty-link {
|
||||
text-decoration: none;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
border: 2px solid #ddd;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||
}
|
||||
|
||||
.faculty-link:hover {
|
||||
transform: scale(1.05);
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
/* Стили для фотографии */
|
||||
.faculty-image {
|
||||
width: 300px;
|
||||
width: 400px;
|
||||
height: 600px;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Стили для текста под фотографией */
|
||||
.faculty-link p {
|
||||
margin: 10px 0;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
/* Медиазапросы для планшетов (768px - 1024px) */
|
||||
@media (max-width: 1024px) {
|
||||
.navbar {
|
||||
width: 70%; /* Увеличиваем ширину навигации */
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 60%; /* Увеличиваем ширину контента */
|
||||
}
|
||||
|
||||
.faculty-image {
|
||||
width: 300px; /* Уменьшаем размер фотографий */
|
||||
height: 450px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Медиазапросы для телефонов (до 768px) */
|
||||
@media (max-width: 768px) {
|
||||
.header-text h1 {
|
||||
font-size: 1.2rem; /* Уменьшаем размер заголовка */
|
||||
}
|
||||
|
||||
.header-text p {
|
||||
font-size: 0.8rem; /* Уменьшаем размер текста */
|
||||
}
|
||||
|
||||
.navbar {
|
||||
width: 90%; /* Навигация занимает почти всю ширину */
|
||||
flex-direction: column; /* Меню в столбец */
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.navbar a {
|
||||
padding: 10px; /* Увеличиваем отступы для удобства */
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 90%; /* Контент занимает почти всю ширину */
|
||||
}
|
||||
|
||||
.faculty-image {
|
||||
width: 100%; /* Фотографии занимают всю ширину */
|
||||
height: auto; /* Высота автоматически подстраивается */
|
||||
}
|
||||
|
||||
.faculty-link p {
|
||||
font-size: 1rem; /* Уменьшаем размер текста */
|
||||
}
|
||||
|
||||
.corner-image img {
|
||||
width: 50px; /* Уменьшаем размер иконки */
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
BIN
Отчет по 2 лабе ИП.docx
Normal file
BIN
Отчет по 2 лабе ИП.docx
Normal file
Binary file not shown.
Reference in New Issue
Block a user