3.2основы html css не применился фон и изображение огромного размера
file:///C:/Users/Снежана/Desktop/Без%20имени.png
Не применяется фон.рис для сайта с интернета.И изображение инстаграмм задается огромного размера и не рядом с текстом.И еще не применяется иконка в кнопке "скачать" приложение с файлами и папками FONTAVESOME скачала расположение каталогов тоже правильно.Сделано все как в коде.но он не работает потому что устарел.Что можно сделать?Почему не так все.. file:///C:/Users/%D0%A1%D0%BD%D0%B5%D0%B6%D0%B0%D0%BD%D0%B0/Desktop/HTML/landing/index.html#
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Простой лендинг</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="font-avesome/css/font-avesome.min.css">
<link rel="icon" href="images/webpage-icon-design-vector.jpg">
</head>
<body>
<div id="mainbox">
<header>
<div id="header-shadow">
<div class="wrapper">
<div class="wrapper_item">
<div id="header-left">
<h1>Инстаграмм</h1>
<h2>Создайте аккаунт или войдите в Instagram — это сервис, позволяющий легко и aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaasz6удобно снимать креативные фото и видео, редактировать их, а также делиться ими с друзьями и родственниками.</h2>
<p>Подписчиков: 659 тыс.О себе: Официальная страница Instagram</p>
<a href="#" class="button-download"><i class="fa fa-instagram" aria-hidden="true"></i>Скачать</a>
</div>
<div id="header-right">
<img src="images/293393339002211.png" alt="Инстаграмм">
</div>
<div class="clear"></div>
</div>
</div>
</header>
</div>
</div>
</body>
</html>
СSS
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap');
.clear {
clear: both;
}
body {
background-color: #629b99;
color: #fff;
font-family: 'Roboto', sans-serif;
font-weight: 300;
line-height: 28px;
margin: 0;
padding: 0;
}
header {
background: url(images/10-fon-dlya-sayta.png) 50% 0 no-repeat fixed;
background-size: cover;
color: white;
}
.wrapper {
max-width: 1200px;
margin: 0 auto;
}
.wrapper_item {
display: flex;
justify-content: space-between;
}
header.wrapper {
padding: 100px 15px 50px 50px;
}
#header-shadow {
background: rgba(0,0,0,0,5);
}
h1 {
margin-bottom: 30px;
font-size: 60px;
font-weight: 100;
}
#header-left h1 {
font-size: 72px;
margin-top: 50px;
line-height: 1.1;
}
#header-left h2 {
font-size: 32px;
font-weight: 300;
margin-bottom: 30px;
line-height: 1.1;
}
#header-left h1 strong {
font-weight: 400;
}
#header-left h1, #header-left h2, #header-left p {
margin-right: 40px;
}
#header-left h1, #header-left h2, #header-left p {
margin-right: 40px;
}
#header-left h1 strong {
font-weight: 400;
}
#header-left p {
font-size: 18px;
margin-bottom: 70px;
letter-spacing: 1px;
}
a.button-download {
display: block-inline;
color: #fff;
border: 1px solid #fff;
font-size: 28px;
margin-bottom: 50px;
padding-right: 20px;
padding: 10px 16px;
text-decoration: none;
}
