Предмет: Информатика, автор: prisepad82

Напишите на языке HTML
60 баллов

Приложения:

Ответы

Автор ответа: gxfmzwfcljpbbepref
2

html:

<!DOCTYPE html>

<html lang="ru">

<head>

<meta charset="UTF-8">

<title>Замки Франкции</title>

<link rel="stylesheet" href="css/main.css">

</head>

<body style="background-image: url(твой фон); background-repeat: no-repeat; background-size: cover;">

<header>

 <div class="container">

  <strong>Замки Франции</strong>

 </div>

</header>

<section>

 <div class="container">

  <div class="menu">

   <ul>

    <li>Разделы</li>

    <li><a href="#" style="color: #d3d3d3;">Главная</a></li>

    <li><a href="#" style="color: #d3d3d3;">Версаль</a></li>

    <li><a href="#" style="color: #d3d3d3;">Замок Шамбор</a></li>

    <li><a href="#">Замок Шенонсо</a></li>

    <li><a href="#">Источник</a></li>

   </ul>

  </div>

  <h1>Замок Шамбор</h1>

 <div class="text">

  <p><img src="твоя картинка замка" alt="замок шамбор"></p>

  <p>твой текст</p>

 </div>

 </div>

</section>

<footer>

<div class="container">

 <p>Автор:Фамилия Имя</p>

 <p>апрель 2020 г.</p>

</div>

</footer>

</body>

</html>

CSS:

.container {

font-size: 1.75em;

width: 90%;

border: 4px double black;

 

}

header {

display: flex;

text-align: center;

justify-content: center;

font-size: 1.5em;

}

section {

display: flex;

text-align: center;

justify-content: space-around;

}

.menu {

width: 200px;

padding-right: 20px;

height: 100%;

float: left;

border-right: 4px double black;

}

.menu li {

font-weight: bold;

list-style-type: none;

padding: 10px;

}

.menu a {

color: black;

}

.text {

display: flex;

justify-content: space-around;

}

footer {

font-weight: bold;

display: flex;

text-align: center;

justify-content: center;

}

footer p {

margin: 5px;

}

img {

width: 350px;

padding: 10px;

}

Похожие вопросы
Предмет: Русский язык, автор: 200231