Почему не вставляется фон?
Я только начинаю разбирать в вэб разработке почему цвет в файле style.css не отображается?
index.html:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> <link rel="stylesheet" href="style.scss"> </head> <body> <div class="pag"> <div class="wrapper"> <header> <nav> <ul class="nav"> <li class="nav-item">Anri</li> </ul> </nav> <img src="IMG/logo.jpg" alt="logo"> </header> </div> </div> </body> </html> |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> <link rel="stylesheet" href="style.scss"> </head> <body> <div class="pag"> <div class="wrapper"> <header> <nav> <ul class="nav"> <li class="nav-item">Anri</li> </ul> </nav> <img src="IMG/logo.jpg" alt="logo"> </header> </div> </div> </body> </html>
Style.css
$accent: #2a2b38; $dark: #5c72eb; .pag { background-color: $accent; } |
$accent: #2a2b38; $dark: #5c72eb; .pag { background-color: $accent; }
Дополнительно:
Браузер не умеет работать с scss.
Ваш код сначала нужно скомпилировать в css.
Посмотрите в сторону Gulp (для верстки за глаза).
Также можно заменить препроцессорные переменные на кастомные свойства css. Но их работа различается.
- Я установил Live sas Compiler, это поможет решению проблемы?
- Foxford12, поможет.
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Чтобы разобраться, почему не вставляется фон на вашем сайте, вам следует проверить несколько возможных причин:
1. Проверьте, правильно ли вы указали путь к изображению фона в CSS. Убедитесь, что путь указан правильно относительно файла стилей. Например, если изображение находится в папке "images", то путь должен быть указан как "../images/background.jpg".
body { background-image: url('../images/background.jpg'); }
2. Убедитесь, что изображение для фона существует по указанному пути. Проверьте, не содержит ли файл неправильных символов в названии, и что он имеет подходящий формат (например, .jpg, .png, .svg).
3. Проверьте, не перекрывает ли другой CSS-стиль ваш фон. Убедитесь, что у вас нет других правил, которые могут перекрыть стиль фона. Попробуйте временно удалить все другие стили и посмотреть, помогает ли это.
4. Проверьте, не переопределяют ли стили фона другие элементы на странице. Иногда другие элементы, такие как контейнеры или блоки, могут перекрывать стиль фона. Убедитесь, что ваш элемент с фоном имеет достаточный размер и не перекрыт другими элементами.
Если после выполнения этих шагов фон все равно не отображается, попробуйте очистить кэш браузера или проверить ваш код на других браузерах. Возможно, проблема связана с кэшированием или браузерной совместимостью. Если проблема сохраняется, уточните дополнительные детали или код, чтобы мы могли вам помочь более точно.