Не отображаются стили css в браузере, как подключить их к html?
* {margin:0; padding:0;}
div {margin: 50px auto;}
. blok1 {
width: 400px;
height: 268px; background-image: url(../bee-on-daisy.jpg);
background-color: ##FFC0CB
}
Здравствуйте! Начала учить html и css. Всё вроде писала как в инструкции, но почему-то не работает background-image. Не отображается в браузере, что бы я ни делала. Пока пробовала, оказалось, что вообще ни одно свойство из css не работает. Буду благодарна за помощь. Прилагаю код.
<!DOCTYPE html>
<html lang=ru>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/style.css">
<title>Шапка для сайта</title>
</head>
<body>
<div class="blok1"></div>
</body>
</html>
1 ответов
Попробуйте сделать как в уроке, например у вас написан путь к CSS файлу такой:
css/style.css
а в уроке путь к CSS файлу такой:
assets/css/style.css
Также проверьте, что файл называется style.css (как выше указан), а не styles.css.
Проверить путь к файлу можно в инструментах разработчика браузера, как в уроке (на 16 минут 30 секунд):
https://fructcode.com/ru/courses/html-and-css-advanced/css-first/
У вас также есть в стилях в background такой путь к картинке:
background-image: url(../bee-on-daisy.jpg);
Его тоже нужно проверить через инструменты разработчика (ссылка на урок выше).
Также у вас здесь ошибки:
. blok1 {
width: 400px;
height: 268px; background-image: url(../bee-on-daisy.jpg);
background-color: ##FFC0CB
}
1) . blok1 - точка должна перед blok1 быть без пробела, у вас .[ПРОБЕЛ]blok1
2) background-color: ##FFC0CB - не стоит точки с запятой (лучше поставить, хоть если свойство последнее стоит в стилях, будет работать и без точки запятой)
3) background-color: ##FFC0CB - лишняя #, должна быть одна #
И нужно соблюдать форматирование кода, а то потом запутаться можно, вот так нужно сделать:
* {
margin: 0;
padding: 0;
}
div {
margin: 50px auto;
}
.blok1 {
width: 400px;
height: 268px;
background-image: url(../bee-on-daisy.jpg);
background-color: #ffc0cb;
}