-
Notifications
You must be signed in to change notification settings - Fork 0
/
Task22.html
137 lines (125 loc) · 6.29 KB
/
Task22.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!DOCTYPE html>
<html>
<head>
<style>
/* Это css-код, который определяет стиль элементов html */
body {
background-color: #FEEBC8;
/* Светло-оранжевый цвет фона */
font-family: Arial, sans-serif;
/* Шрифт для всего текста */
}
h1 {
color: #333333;
/* Темно-серый цвет текста */
font-size: 24px;
/* Размер шрифта */
text-align: center;
/* Выравнивание текста по центру */
}
.header {
display: flex;
/* Расположение элементов в строку */
justify-content: space-between;
/* Равномерное распределение пространства между элементами */
align-items: center;
/* Выравнивание элементов по вертикали */
padding: 10px;
/* Отступы внутри элемента */
border-bottom: 1px solid #333333;
/* Нижняя граница темно-серого цвета */
}
.tab {
color: #333333;
/* Темно-серый цвет текста */
font-size: 18px;
/* Размер шрифта */
text-decoration: none;
/* Отмена подчеркивания ссылок */
}
.tab:hover {
color: #FF6600;
/* Оранжевый цвет текста при наведении курсора */
}
.section {
background-color: white;
/* Белый цвет фона */
margin: 20px;
/* Отступы вокруг элемента */
padding: 20px;
/* Отступы внутри элемента */
}
.title {
color: #FF6600;
/* Оранжевый цвет текста */
font-size: 20px;
/* Размер шрифта */
font-weight: bold;
/* Жирный шрифт */
}
.bullet {
color: #FF6600;
/* Оранжевый цвет текста */
font-size: 16px;
/* Размер шрифта */
}
.text {
color: #333333;
/* Темно-серый цвет текста */
font-size: 14px;
/* Размер шрифта */
}
.duration {
color: #333333;
/* Темно-серый цвет текста */
font-size: 12px;
/* Размер шрифта */
font-style: italic;
/* Курсивный шрифт */
}
</style>
</head>
<body>
<div class="header"> <!-- Это контейнер для заголовка -->
<a href="#" class="tab">Заголовок</a> <!-- Это ссылка, которая выглядит как вкладка -->
<a href="#" class="tab">Заголовок </a> <!-- Это еще одна ссылка-вкладка -->
<span class="tab">Дата изменения</span> <!-- Это просто текст, который не является ссылкой -->
</div>
<div class="section"> <!-- Это контейнер для раздела с планом занятий -->
<h1>План занятий</h1> <!-- Это заголовок раздела -->
<p> <!-- Это абзац с информацией о лекции 1 -->
<span class="bullet">●</span> <!-- Это маркер в виде круга -->
<span class="title">Лекция 1</span> <!-- Это название лекции -->
<span class="duration">37 минут</span> <!-- Это продолжительность лекции -->
<br> <!-- Это перенос строки -->
<span class="text">Основы ТРИЗ</span> <!-- Это текст с описанием лекции -->
<br>
<span class="text">Введение в дисциплину, цели и содержание предметной области. Основные постулаты и
принципы творческих задач. Уровни сложности.</span>
</p>
<p> <!-- Это абзац с информацией о лекции 2 -->
<span class="bullet">●</span>
<span class="title">Лекция 2</span>
<span class="duration">1 час 14 минут</span>
<br>
<span class="text">Приемы разрешения технических противоречий</span>
<br>
<span class="text">Рассматриваются различные приемы решений и приводятся примеры в области информационных
технологий. Дробление, вынесение, местное качество, асимметрия, объединение, универсальность и другие
(всего 5 приемов). Таблица Альтшуллера.</span>
</p>
<p> <!-- Это абзац с информацией о лекции 3 -->
<span class="bullet">●</span>
<span class="title">Лекция 3</span>
<span class="duration">1 час 24 минуты</span>
<br>
<span class="text">Примеры решения задач</span>
<br>
<span class="text">Психологическая инерция. Моделирование задачи и решений. Модель развития систем. Закон
повышения идеальности, виды идеальности, идеальность в программировании. Развитие конечный
результат.</span>
</p>
<!-- Здесь вы можете добавить информацию о лекции 4 -->
</div>
</body>
</html>