Это проблема с файлом изображения или проблема с размером? HTML CSS вопрос о фоновом изображении - PullRequest
Новая
       87

Это проблема с файлом изображения или проблема с размером? HTML CSS вопрос о фоновом изображении

0 голосов
/ 05 августа 2020

Я все время пытаюсь использовать разные изображения в качестве фона, но мне пока не повезло с выяснением, проблема ли это в размере файла фотографии или что-то не так с изображениями, которые я использую? Спрашиваю, поскольку я пробовал с одним изображением, а фоновое изображение отображается и работает, но любое другое изображение, которое я хочу использовать, не будет отображаться или работать должным образом, даже если я просматривал свой код несколько раз, и он правильный. Вот мой текущий код 

<!DOCTYPE html>
<html>
    <head>
        <title>Winston Berz</title>
        <style>
            body {
                background-image: url("C:\Users\apere\OneDrive\Desktop\HTML Progress\Winston Berz\All Photos\img5.jpg") no-repeat center center fixed;
                min-height: 100%;
                background-size: 100%;
            }
        </style>
    </head>
    <body>
        <div id="Navbar">
            <nav>
                <a href="Main P.html">Main</a>
                <a href="About me P.html">About Me</a>
                <a href="Contact P.html">Contact</a>
                <a href="Photos P.html">Photos</a>
            </nav>
        </div>
        <div id="Main Title">
            <header>
                <h1>Winston Berz</h1>
            </header>

    </body>
</html>

Хочу также отметить, что я также использовал отдельный документ для css и получил те же результаты, поэтому на этот раз я прибег к внутреннему css. Помогите! Пожалуйста, и спасибо, я все еще относительно новичок в программировании.

1 Ответ

0 голосов
/ 06 августа 2020

вы можете попытаться очистить кеш браузера ( здесь как), возможно, браузер сохраняет предыдущие изображения.

Кроме того, вы можете подумать о создании <div> и разместить свой фон images вместо того, чтобы устанавливать изображение внутри css.

внутри тега <body> вы можете добавить 

<div class="background-images-wrapper">
<img src="image/link/path" alt="background1"><img>
</div>

и внутри своей таблицы стилей css вы добавляете это 

.background-images-wrapper{
  height: 100%;
  width: 100%:
  object-fit: cover;
  z-index: -1;

z-index: -1 - чтобы ваши изображения всегда оставались позади остальных элементов

...