Skip to content
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions lab3/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@

55 changes: 55 additions & 0 deletions lab3/main.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
<!DOCTYPE html>
<html>
<head>
<title> Визитка </title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="block">
<h1>Визитка</h1>
<p>Данная визитка создана студентом Самарского Университета гр. 6211-100503D</p>
</div>
<div class="block">
<h2>Вводная информация:</h2>
<div class="content">
<img src="mypic.jpg" alt="Мое фото">
<p>Тягун Андрей Романович
<br>Дата рождения: 30.07.2006
<br>Любимые увлечения: автомобили, программирование
<br>Ссылка на github:
<br><a href="https://github.com/HLLDRGN" class="button">github</a>
</p>
</div>
</div>
<div class="block">
<h2>О себе</h2>
<p>Меня зовут Андрей, я являюсь студентом группы 6211 прекрасного направления ИБАС
<br> В данной лабораторной работе я реализовал большую часть навыков, полученных в результате изучения
<br> предмета "Web"
</p>
</div>
<div class="block">
<h2>Скиллы</h2>
<div class="skills-section">
<h3>Hard-скиллы</h3>
<ul>
<li>C++ - Junior</li>
<li>Python - Junior</li>
<li>Web - Junior</li>
<li>C - Junior</li>
</ul>
</div>
<div class="skills-section">
<h3>Soft-скиллы</h3>
<ul>
<li>Коммуникативность</li>
<li>Умение работать в команде</li>
<li>Умение исправлять ошибки</li>
<li>Адекватная реакция на критику</li>
</ul>
</div>
</div>
</body>
</html>
Binary file added lab3/mypic.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
149 changes: 149 additions & 0 deletions lab3/styles.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,149 @@
html {
box-sizing: border-box;
font-size: 16px;
}

*, *::before, *::after {
box-sizing: inherit;
}

body {
background-color: #943e4d;
background-attachment: fixed;
max-width: 1200px;
width: 100%;
margin: 0 auto;
padding: 0 16px 32px;
min-height: 100vh;
font-family: 'Courier New', monospace;
overflow-y: auto;
overflow-x: hidden;
}

h1,
h2 {
text-align: center;
color: #b6ae7f;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
letter-spacing: 1px;
margin: 0 0 1rem 0;
}

h3 {
color: #b6ae7f;
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
font-size: 1.1rem;
margin: 0.5rem 0;
padding: 0 1.25rem;
}
.name,
.block {
background: #8a0017;
border-radius: 14px;
width: 100%;
margin: 28px 0;
padding: 1rem;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
transition: transform 0.3s ease, box-shadow 0.3s ease;
border: 1px solid rgba(255,255,255,0.03);
}

.block:hover {
transform: translateY(-5px);
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.4);
}

p {
color: #b6ae7f;
font-size: clamp(1rem, 1.2vw + 0.8rem, 1.6rem);
padding: 1.25rem;
margin: 0;
line-height: 1.6;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

ul {
color: #b6ae7f;
font-size: clamp(0.95rem, 1.1vw + 0.75rem, 1.5rem);
padding: 0 1.25rem 1.25rem 2.75rem;
margin: 0;
line-height: 1.8;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
list-style: disc;
}

ul li {
margin-bottom: 0.4rem;
}

.skills-section {
margin-bottom: 1.5rem;
}

.content {
display: flex;
align-items: center;
gap: 28px;
padding: 1.25rem;
flex-wrap: wrap;
}

@media (max-width: 768px) {
.content {
flex-direction: column;
gap: 20px;
}
}

.content img {
width: 280px;
height: 280px;
border-radius: 12px;
object-fit: cover;
flex-shrink: 0;
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45);
border: 2px solid #b6ae7f;
transition: transform 0.3s ease;
}

.content img:hover {
transform: scale(1.02);
}

.content p {
padding: 0;
margin: 0;
flex: 1;
min-width: 250px;
}

.button {
background: linear-gradient(135deg, #5a000f 0%, #6a0015 100%);
padding: 12px 28px;
margin: 12px auto;
border-radius: 14px;
color: #b6ae7f;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
border: 1px solid rgba(182, 174, 127, 0.15);
cursor: pointer;
font-family: 'Courier New', monospace;
font-size: 1.75rem;
font-weight: bold;
transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
display: block;
text-decoration: none;
text-align: center;
}

.button:hover {
transform: translateY(-3px);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.45);
background: linear-gradient(135deg, #6a0015 0%, #7a001b 100%);
}

.button:active {
transform: translateY(-1px);
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.3);
}

1 change: 1 addition & 0 deletions Лабораторная работа 1/.gitkeep
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@

58 changes: 58 additions & 0 deletions Лабораторная работа 1/laba1.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Лабораторная работа 1 - Вариант 24</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>Лабораторная работа 1</h1>
<h2>Вариант 24</h2>
<h3>Выполнил: Тягун Андрей</h3>

<!-- Задание с форматированием текста -->
<div class="task">
<h2>Задание 1: Текст с форматированием</h2>
<div class="text-block">
<p>JavaScript (аббр. JS) — мультипарадигменный язык программирования. Поддерживает объектно-ориентированный, императивный и функциональный стили. Является реализацией спецификации ECMAScript (стандарт ECMA-262).</p>
<p>JavaScript обычно используется как встраиваемый язык для программного доступа к объектам приложений. Наиболее широкое применение находит в браузерах как язык сценариев для придания интерактивности веб-страницам.</p>
</div>
</div>

<!-- Наложение двух картинок -->
<div class="task">
<h2>Задание 2: Наложение изображений</h2>
<div class="image-container">
<img src="https://img2.akspic.ru/crops/8/4/6/4/6/164648/164648-kot-kotenok-privlekatelnost-golova-glaz-3840x2160.jpg" alt="Изображение 1" class="image1">
<img src="https://i.pinimg.com/236x/cd/16/12/cd16121609a79d95dffbfa28a326331e.jpg" alt="Изображение 2" class="image2">
</div>
</div>

<!-- Светофор -->
<div class="task">
<h2>Задание 3: Светофор</h2>
<div class="traffic-light">
<div class="light red"></div>
<div class="light yellow"></div>
<div class="light green"></div>
</div>
</div>

<!-- Лабирант -->
<div class="task">
<h2>Задание 4: Лабиринт 3x3</h2>
<div class="maze">
<div class="cell">1</div>
<div class="cell">2</div>
<div class="cell">3</div>
<div class="cell">4</div>
<div class="cell">5</div>
<div class="cell">6</div>
<div class="cell">7</div>
<div class="cell">8</div>
<div class="cell">9</div>
</div>
</div>
</body>
</html>
Loading