lab1 #1

Closed
MorozovDanil wants to merge 7 commits from lab1 into main
14 changed files with 325 additions and 0 deletions

37
account.html Normal file
View File

@@ -0,0 +1,37 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<title>Личный кабинет</title>
<meta charset="UTF-8">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div class="menu">
<a href="index.html">
<img src="img/manga.png" alt="ЛОГО">
</a>
<p>надо будет прикрепить, чтобы не двигался при прокрутке</p>
<p>Тут возможно будет каталог</p>
</div>
<div class="input">
<form class="form">
<div class="form-row input">
<p>Введите номер телефона</p>
<input type="tel" placeholder="Телефон" id="number" name="number_acc">
</div>
<div class="form-row input">
<p>Введите пароль</p>
<input type="text" placeholder="Пароль" id="password" name="password_acc">
</div>
<div class="form-row input">
<button type="submit">Вход</button>
</div>
</form>
</div>
</body>
</html>

29
author.html Normal file
View File

@@ -0,0 +1,29 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<title>Авторство</title>
<meta charset="UTF-8">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div class="menu">
<a href="index.html">
<img src="img/manga.png" alt="ЛОГО">
</a>
<p>каталог возможно</p>
</div>
<div class="author">
<img src="img/ХаяоМиядзаки.png" alt="">
<div class="description">
<h3>Автор: Хаяо Миядзаки</h3>
<p>посвящено автору и тп. Lorem ipsum, dolor sit amet consectetur adipisicing elit. Consequuntur quod harum voluptate architecto, sit eaque, voluptatibus excepturi deleniti consequatur porro vero dolorem dolorum vitae laborum libero et veritatis sapiente a?</p>
</div>
</div>
</body>
</html>

60
css/style.css Normal file
View File

@@ -0,0 +1,60 @@
* {
margin: 0;
padding: 0;
}
body {
background-color: #0f0630;
font-family: Arial, Helvetica, sans-serif;
color: #f0ffff;
}
a {
text-decoration: none;
color: bisque;
}
div {
background-color: #312b46;
width: 1300px;
margin: 0 auto 10px;
}
.author {
display: flex;
}
.input {
width: 700px;
margin-top: 70px;
}
.menu {
margin-bottom: 50px;
}
.icons {
display: flex;
flex-wrap: wrap;
}
.icon {
width: 150px;
margin: 0 30px;
}
.card {
display: flex;
}
h3 {
margin-bottom: 15px;
}
.read{
width: 500px;
display: block;
}

BIN
img/SL1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 MiB

BIN
img/SL2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 558 KiB

BIN
img/manga.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 453 KiB

BIN
img/заглушка.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

BIN
img/новость.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

112
index.html Normal file
View File

@@ -0,0 +1,112 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<title>Заголовок страницы</title>
<meta charset="UTF-8">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div class="menu">
<a href="index.html">
<img src="img/manga.png" alt="ЛОГО">
</a>
<p>надо будет прикрепить, чтобы не двигался при прокрутке</p>
<p>Тут возможно будет каталог</p>
<a href="account.html">вход</a>
</div>
<div class="main">
<h3>Наши произведения</h3>
<section class="icons"><!--секция с обложками-->
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
<div class="icon">
<a href="manga.html">
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
</a>
</div>
</section>
</div>
<div class="news">
<h3>Наши новости:</h3>
<section class="card-news"><!--секция с новостями-->
<div class="card">
<a href="news.html">
<img src="img/новость.jpg" alt="">
</a>
<div class="description-news">
<h4>Новость 1</h4>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Libero laborum possimus itaque quibusdam beatae ipsam odit sed? Vel blanditiis repellendus,
ea nam, incidunt odio sit amet sequi nihil, laudantium aspernatur!</p>
</div>
</div>
<div class="card">
<a href="news.html">
<img src="img/новость.jpg" alt="">
</a>
<div class="description-news">
<h4>Новость 2</h4>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Libero laborum possimus itaque quibusdam beatae ipsam odit sed? Vel blanditiis repellendus,
ea nam, incidunt odio sit amet sequi nihil, laudantium aspernatur!</p>
</div>
</div>
</section>
</div>
</body>
</html>

32
manga.html Normal file
View File

@@ -0,0 +1,32 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<title>сама манга?</title>
<meta charset="UTF-8">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div class="menu">
<a href="index.html">
<img src="img/manga.png" alt="ЛОГО">
</a>
<p>надо будет прикрепить, чтобы не двигался при прокрутке</p>
<p>Тут возможно будет каталог</p>
<a href="account.html">вход</a>
</div>
<div>
<figure>
<img src="img/заглушка.jpg" alt="">
<figcaption>Заглушка</figcaption>
</figure>
<p>здесь будет сама инфа о манге</p>
<a href="author.html">про автора</a>
<a href="reading.html">Читать</a>
</div>
</body>
</html>

27
news.html Normal file
View File

@@ -0,0 +1,27 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<title>Новость</title>
<meta charset="UTF-8">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div class="menu">
<a href="index.html">
<img src="img/manga.png" alt="ЛОГО">
</a>
<p>надо будет прикрепить, чтобы не двигался при прокрутке</p>
<p>Тут возможно будет каталог</p>
<a href="account.html">вход</a>
</div>
<div>
<img src="img/новость.jpg" alt="">
<p>Новость Lorem, ipsum dolor sit amet consectetur adipisicing elit. Beatae exercitationem eligendi error. Architecto voluptatum eaque, nostrum ea a consequuntur, deleniti dolor provident sequi dicta culpa magnam delectus amet distinctio autem?</p>
</div>
</body>
</html>

28
reading.html Normal file
View File

@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<title>Читать мангу...</title>
<meta charset="UTF-8">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div class="menu">
<a href="index.html">
<img src="img/manga.png" alt="ЛОГО">
</a>
<p>надо будет прикрепить, чтобы не двигался при прокрутке</p>
<p>Тут возможно будет каталог</p>
<a href="account.html">вход</a>
</div>
<div class="read">
<img src="img/SL1.png" alt="">
<img src="img/SL2.png" alt="">
</div>
</body>
</html>

BIN
Отчет №1.docx Normal file

Binary file not shown.