Не отображается фон на сайте

Question

body {
    padding: 0;
    margin: 0;
    font-family: 'Blinker', 'wght@900';
    color: 000;
    font-size: 16px;
}
h1,h2,h3,h4,h5,h6 {
    padding: 0;
    margin: 0;
    text-transform: uppercase;
}
ul, li {
    display: block;
}
.contrainer { /*позиционирование по центру*/
    width: 1170px;
    margin: 0 auto;
}
.header {
    background: url('../img/fon.jpg') no-repart center;

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Taxisite</title>
    <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Blinker:wght@900&family=Inter&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="css/main.css">
</head>
<body>
    <header id='header'>
        <div class="container">
            <img src="img/logo.svg" alt="treugol">

        </div>
    </header>
    <section id= "about" class="about">
        <div class="container">

        </div>
    </section>
    <footer id="footer" class="footer">
        <div class="container">

        </div>
    </footer>
</body>
</html>

Почему не отображается фон на сайте? Фон простой, однотонный, но через обычный background не появился. (фон 1920 на 1080)

Answer 1

потому что вы обращаетесь к несуществующему классу .header, у вас есть только id с таким именем, а к id в css обращаются не через точку, а через #. Кроме того, вы опечатались в значении свойства background: no-repeat.

#header {
  background: url('https://i.stack.imgur.com/V8UOG.jpg') no-repeat center;
}

<header id='header'>
  <div class="container">
    <img src="img/logo.svg" alt="treugol">
  </div>
</header>

БЛОГ НА HUSL

Не отображается фон на сайте

Ответы (1 шт):