Professional Documents
Culture Documents
Проскуренко отчет 23.02.21 c ПОСТАНОВКОЙ ЗАДАЧИ
Проскуренко отчет 23.02.21 c ПОСТАНОВКОЙ ЗАДАЧИ
Звіт з практики
Перевірив викладач
________________Г.В. Носова
(дата, підпис)
2021
С.1
ЛІСТИНГ ПРОГРАМ
Частина 1.
Завдання 1. Створити макет сторінки index.html, використовуючи табличне
верстання, згідно варіанту завдання.
- встановити ширину колонок таблиці – меню 20%, сайд бар (якщо присутній)
20%, логотип (якщо присутній) – 20%, «хлібні крихти» - як ширина блоку
контенту;
4-В
Змінити зовнішній вигляд меню та хлібних крихт з використанням CSS
С.4
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Завдання 1</title>
</head>
<body>
<div class="container">
<table>
<tr id="header-wrapper">
<td id="logo">
</td>
<td id="header">
<div id="city">
</div>
</td>
</tr>
<tr>
<td id="breadcrumbs" colspan="2">
<ul>
<a href="#"><li>Домашня</li></a>
<a href="#"><li>Наступна</li></a>
<a href="#"><li>Ця</li></a>
</ul>
</td>
</tr>
<tr id="main">
<td id="aside">
<nav>
<ul>
<a href="#"><li>Пункт меню</li></a>
<a href="#"><li>Пункт меню</li></a>
<a href="#"><li>Пункт меню</li></a>
<a href="#"><li>Пункт меню</li></a>
<a href="#"><li>Пункт меню</li></a>
</ul>
</nav>
</td>
<td id="content">
<h2>Блок контенту</h2>
<p>Довільний контент. Lorem ipsum dolor sit amet
consectetur, adipisicing elit. Consectetur laborum doloremque odit
С.5
@keyframes city {
from { background-position: -675px, 0 0;}
to { background-position: 0 }
}
* {
text-align: center;
}
body {
background-color: gray;
background-image: url('../background.jpg');
}
С.6
img {
border-radius: 25px;
}
.container {
width: 900px;
margin: 0 auto;
}
table {
width: 100%;
}
td {
margin: 5px;
vertical-align: middle;
}
ul {
list-style: none;
margin: 0;
padding: 0;
}
li:hover {
opacity: 0.7;
box-shadow: 1px 3px 5px 1px white;
}
#breadcrumbs ul {
padding: 15px 0;
}
#breadcrumbs li {
display: inline;
margin-right: 5px;
border: 2px solid black;
background-color: #3498DB;
padding: 5px;
}
nav ul {
padding-left: 15px;
}
nav li {
border: 2px solid black;
С.7
background-color: #F4D03F;
padding: 5px;
margin-top: 10px;
width: 80%;
transition: opacity 0.5s ease-out;
li {
font-family: 'Arial', sans-serif;
color: black;
text-decoration: underline;
}
p {
text-align: justify;
}
#logo, #aside {
width: 20%;
}
#header, #content {
width: 80%;
}
#logo {
height: 250px;
background-image: url('../logo.png');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-color: #040E2B;
}
#city {
height: 250px;
background: url('../city.png') repeat-x;
background-size: cover;
animation: city 30s linear infinite;
}
#header {
height: 250px;
background: url('../sky.jpg') repeat-x;
background-position: top;
background-size: cover;
}
С.8
#breadcrumbs {
background-color: #AAB7B8;
}
#aside {
background-color: #2E86C1;
vertical-align: top;
}
#content {
background-color: #F4D03F;
padding: 0 20px;
}
#footer {
background-color: #7D3C98;
height: 50px;
}
<main>
<div class="container">
<div class="row mb-1">
<aside class="col-md-3 pull-right"
style="background-color: #2E86C1;">
<nav>
<ul>
<a href="#"><li>Пункт
меню</li></a>
<a href="#"><li>Пункт
меню</li></a>
<a href="#"><li>Пункт
меню</li></a>
<a href="#"><li>Пункт
меню</li></a>
<a href="#"><li>Пункт
меню</li></a>
</ul>
</nav>
</aside>
<article class="col-md-9 pull-left"
style="background-color: #F4D03F;">
<h2>Блок контенту</h2>
<p>Довільний контент. Lorem ipsum dolor, sit
amet consectetur adipisicing elit. Quis modi perferendis expedita,
illum dignissimos rerum temporibus praesentium totam quas. Ab
dolorum reiciendis doloremque expedita deserunt dolor cum asperiores
vitae voluptates.
Repellendus, eos sit. Autem voluptatibus
facere sunt consequuntur laboriosam totam quam. Minima dignissimos,
minus voluptatibus deleniti vitae quo magni ex perspiciatis,
quibusdam iusto fugit delectus soluta, recusandae nostrum iste vel?
Fuga, ab animi exercitationem voluptate
deserunt modi similique soluta officia officiis, illo rem iure
corrupti quis blanditiis mollitia. Perferendis, obcaecati repellat.
Labore eaque nesciunt minus voluptatem accusamus explicabo omnis
doloremque?
Enim, iure. Accusamus deserunt impedit
dolorum eius ea perspiciatis quidem consequatur est ratione suscipit
dolorem labore voluptatibus architecto iusto blanditiis dolore,
voluptate animi cumque quae nulla repellendus. Facilis, veniam
accusamus?
Obcaecati, distinctio minus? Architecto quas
ratione error at, vitae maiores in qui animi, quidem consectetur
С.11
@keyframes city {
from { background-position: -675px, 0 0;}
to { background-position: 0 }
}
* {
text-align: center;
}
body {
background-color: gray;
background-image: url('../background.jpg');
}
img {
border-radius: 25px;
}
.container {
max-width: 900px;
}
p {
text-align: justify;
С.12
/*
.col-md-3, .col-md-9, .col-md-12 {
border: 2px solid black;
}
*/
#breadcrumbs .row {
height: 100px;
}
ul {
list-style: none;
margin: 0;
padding: 0;
}
li:hover {
opacity: 0.7;
box-shadow: 1px 3px 5px 1px white;
}
#breadcrumbs ul {
padding-top: 30px;
}
#breadcrumbs li {
display: inline;
margin-right: 5px;
border: 2px solid black;
background-color: #3498DB;
padding: 5px;
transition: opacity 0.2s ease-out;
}
nav li {
border: 2px solid black;
background-color: #F4D03F;
padding: 5px;
margin-top: 10px;
С.13
li {
font-family: 'Arial', sans-serif;
color: black;
text-decoration: underline;
}
#logo {
height: 250px;
background-image: url('../logo.png');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
header .col-md-9 {
padding: 0;
}
#city {
height: 250px;
background: url('../city.png') repeat-x;
background-size: cover;
animation: city 30s linear infinite;
}
.header {
height: 250px;
background: url('../sky.jpg') repeat-x;
background-position: top;
background-size: cover;
}
С.14
Частина 2.
<!DOCTYPE html>
<html lang="uk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Завдання 1</title>
</head>
<body>
<div class="container">
<main>
<form>
<div class="wrapper">
<div>
<p><label
for="a">A<sub>11</sub>:</label></p>
<p><input type="number" id="a11"
value="0"></p>
С.15
<p><label
for="b">A<sub>12</sub>:</label></p>
<p><input type="number" id="a12"
value="0"></p>
</div>
<div>
<p><label
for="c">A<sub>21</sub>:</label></p>
<p><input type="number" id="a21"
value="0"></p>
<p><label
for="d">A<sub>22</sub>:</label></p>
<p><input type="number" id="a22"
value="0"></p>
</div>
</div>
<button id="calculate"
type="button">Обрахувати</button>
<h2 id="result"></h2>
</form>
</main>
</div>
<script src="index.js"></script>
</body>
</html>
body {
padding: 0;
margin: 0;
box-sizing: border-box;
background-image: url('background.jpg');
}
.container {
width: 1170px;
margin: 0 auto;
}
main {
text-align: center;
display: flex;
align-items: center;
justify-content: center;
С.16
height: 100vh;
}
form {
padding: 25px;
background-color: rgba(255, 255, 255, 0.8);
border: 7px dashed #FDFDFD;
}
form p {
text-align: left;
font-size: 20px;
font-weight: bold;
}
.wrapper {
display: flex;
justify-content: center;
align-items: center;
}
result = document.getElementById('result');
document.getElementById('calculate').onclick = () => {
a11 = document.getElementById('a11').value;
a12 = document.getElementById('a12').value;
a21 = document.getElementById('a21').value;
a22 = document.getElementById('a22').value;
result.innerText = 'Результат: ' + (a11 * a22 - a12 * a21);
}
С.17
Завдання 2. Дано 2 поля вводу тексту. Очищати поля, якщо текст, що набирають у
першому полі співпадає ії текстом у другому.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
<title>Завдання 2</title>
</head>
<body>
<div id="form-wrapper">
<form>
<h3>Дано 2 поля вводу тексту. Очищати поля, якщо
текст,<br> що набирають у першому полі співпадає ії текстом у
другому.</h3>
<br>
<input type="text" id="input1">
<input type="text" id="input2">
</form>
</div>
<script src="index.js"></script>
С.18
</body>
</html>
$('input1').onkeyup = () => {
if ($('input1').value == $('input2').value) {
$('input1').value = '';
$('input2').value = '';
}
}
result = $('#result');
$('#calculate').click(() => {
a11 = $('#a11').val();
a12 = $('#a12').val();
a21 = $('#a21').val();
a22 = $('#a22').val();
result.text('Результат: ' + (a11 * a22 - a12 * a21));
});
С.19
Частина 3.
Завдання 3. Задача 1.
- пункт назначения;
- номер рейса;
Код програми:
#include <iostream>
#include <string>
#include <iomanip>
#include "windows.h"
using namespace std;
struct Node
{
char point[20];
int reis;
char name[12];
char surname[12];
char patr[12];
char date[12];
Node* next;
};
void Menu();
Node* addNode(Node* first);
Node* deleteNode(Node* first);
void outNode(Node* first);
void outNodeNum(Node* first);
int main()
{
SetConsoleCP(1251);
SetConsoleOutputCP(1251);
Node* first = new Node; first->reis = 1021; strcpy_s(first-
>name, 20, "Олег"); strcpy_s(first->surname, 20, "Бышовец");
strcpy_s(first->patr, 20, "Кекович"); strcpy_s(first->point, 20,
"Москва"); strcpy_s(first->date, 20, "12.12.1967");
first->next = NULL;
int k = 5;
while (k != 6)
{
switch (k)
{
case 1: first = addNode(first); break;
case 2: outNode(first); break;
case 3: outNodeNum(first); break;
case 4: first = deleteNode(first); break;
case 5: Menu(); break;
case 6: break;
С.23
void Menu()
{
system("cls");
cout << "\n";
cout << "1 - Добавить заявку\n";
cout << "2 - Вывести все заявки\n";
cout << "3 - Вывести заявку по номеру рейса и дате вылета\n";
cout << "4 - Удалить заявку\n";
cout << "5 - Очистить экран\n";
cout << "6 - Выход\n";
}
}
else
{
Node* p = first;
while (p->next != NULL)
{
p = p->next;
}
p->next = pv;
}
return first;
}
Node* pv = first;
while (pv)
{
cout << setw(12) << pv->point << setw(7) << pv->reis <<
setw(11) << pv->surname;
cout << setw(10) << pv->name << setw(13) << pv->patr <<
setw(12) << pv->date << endl;
pv = pv->next;
}
cout <<
"_________________________________________________________________\n
";
}
}
if (k == 0 && N > 0)
{
temp = temp->next;
delete first;
cout << " Удаление прошло успешно!\n";
cout <<
"______________________________________________\n";
return temp;
}
Node* el = first;
temp = first->next;
while (temp->next)
{
if (temp->reis == num)
{
el->next = temp->next;
delete temp;
cout << " Удаление прошло успешно!\n";
cout <<
"______________________________________________\n";
return first;
}
el = el->next;
temp = temp->next;
}
el->next = NULL;
delete temp;
cout << " Удаление прошло успешно!\n";
cout << "______________________________________________\n";
return first;
}
else
{
cout << " Такого рейса нет или список пуст!\n";
cout << "______________________________________________\n";
return first;
}
}
С.27
Код програми:
#include <iostream>
#include <iomanip>
using namespace std;
int main()
{
setlocale(LC_ALL, "Rus");
const int size = 5;
const int inf = 100;
int C[size][size] =
{
{ 0,3,4,6,inf },
{ 0,2,2,3,2 },
{ 1,1,5,5,8 },
{ 0,1,2,3,6 },
{ 2,5,4,8,7 }
};