ДАЮ СТО БАЛЛОВ, САЙТ НА HTML И CSS
1. Создать не менее 3 HTML-страниц, связанных между собой ссылками,
использовать предложенный макет. Ширина основного блока 1000px.
Ширину и высоту остальных блоков распределить самостоятельно. Все
блоки обозначить цветом, используя CSS. Основной блок выровнять по
центру относительно окна браузера. Для сайдбара найти рекламные картинки
необходимого размера и разместить их
2. На главной странице в шапке сайта разместить ссылки:
главная/новости/регистрация. На странице «новости» разместить
информацию новостного характера. На странице «регистрация» разместить
форму регистрации, использовать текстовые поля, радио, флажки,
меню select, textarea, кнопки «Зарегистрироваться» и «Отменить»
Данные из формы должны посылаться в БД, на их основе идет создание
нового пользователя и возможность его авторизации по введенным
данным.
Тема: Проектирование сайта для учета домашних финансов
Answers & Comments
index html:
<!DOCTYPE html>
<html lang="en">
<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>
<header>
<nav>
<ul>
<li><a href="index.html">Главная</a></li>
<li><a href="news.html">Новости</a></li>
<li><a href="registration.html">Регистрация</a></li>
</ul>
</nav>
</header>
<main>
<div class="content">
<!-- Контент главной страницы -->
</div>
<aside>
<div class="ad">
<!-- Реклама -->
</div>
</aside>
</main>
<footer>
<p>Copyright © Ваш сайт
<?php
$currentYear = date('Y');
echo $currentYear;
?>
</p>
</footer>
</body>
</html>
news html:
<!DOCTYPE html>
<html>
<head>
<title>Новости</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="index.html">Главная</a></li>
<li><a href="news.html">Новости</a></li>
<li><a href="registration.html">Регистрация</a></li>
</ul>
</nav>
</header>
<main>
<h1>Новости</h1><br>
<br><div class="article"><br><br><br>
<h2>Заголовок новости 1</h2><br>
<p>Текст новости 1</p><br>
</div>
<div class="article"><br><br><br><br>
<h2>Заголовок новости 2</h2><br>
<p>Текст новости 2</p><br>
</div>
</main>
</body>
</html>
style css:
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f5f5f5;
}
header {
background-color: #333;
color: #fff;
padding: 20px;
}
nav ul {
margin: 0;
padding: 0;
list-style: none;
}
nav li {
display: inline-block;
margin-right: 20px;
}
nav li:last-child {
margin-right: 0;
}
nav a {
color: #fff;
text-decoration: none;
}
main {
max-width: 1000px;
margin: 0 auto;
display: flex;
}
.content {
flex-grow: 1;
padding: 20px;
}
aside {
width: 300px;
}
.ad {
background-image: url('reklama.jpg');
background-size: cover;
width: 300px;
height: 250px;
margin: 20px;
}
footer {
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
}
так я пологаю намного удобней и лутше понятна суть ответа