Как использовать jpg в качестве фонового изображения в html

Question

Я пытаюсь использовать jpeg, который я сохранил в файл, в качестве фона для файла html, используя путь к нему в качестве URL-адреса. У меня есть следующее, но это не работает. Есть мысли?

<style>
    body {
        background-image:url('C:\Users\...\background.jpg');    
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-position: center; 
    }

Answer 1

Вы можете просто скопировать ссылку прямо из того места, где вы нашли изображение, щелкнув изображение правой кнопкой мыши в браузере, выбрав «Копировать адрес изображения» и вставив его в URL-адрес изображения.

Answer 2

хорошо, так что указать относительный путь очень просто, вам нужно только понимать основную структуру папок c вашего проекта, хотя я не уверен, как вы храните свои файлы и структуру папок, поэтому я скажу идеальную папку структура для внешнего проекта (по моему мнению), и объясню вам, как вы можете использовать относительный путь для активов,

давайте сохраним основной HTML файл в папке, названной вашим проектом, для пример Peadar08 - это имя проекта. поэтому поместите файл index. html в свою папку и на том же уровне сохраните папку для ваших активов, например ...

затем в папке ASSETS создайте дополнительные папки для ваших соответствующих активов (изображения, js, css et c), например ...

Теперь просто посмотрите пример для изображений, и вы можете следовать тому же примеру для других ресурсов. Таким образом, вы можете использовать изображения двумя способами:

1. Как тег IMAGE by img в вашем HTML, поэтому, учитывая вышесказанное, вы можете использовать изображения в своем HTML следующим образом.

   <img src="assets/images/example.png" alt="altText"/>

Таким образом, ваше изображение будет идеально отображаться как ресурсы, а ваш файл HTML находится на том же уровне, поэтому просто укажите путь, начинающийся с имени папки .

теперь посмотрите другой пример, если вам нужно использовать свое изображение в качестве фонового изображения с помощью CSS

, поэтому все, что вам нужно сделать, это использовать от ../ до go одну папку назад, потому что вы находитесь в css файле и ../, это перенесет вас на одну папку вверх, то есть в папку с ресурсами, а затем вы сможете следовать по пути. поэтому в вашем CSS используйте это ..

.ExampleClass {
    background-image: url('../assets/images/example.png');
}

, чтобы переместить 2 папки вверх, просто используйте ../../ и т. д.

Надеюсь, это вам поможет.

Answer 3

Вам не нужно указывать местоположение непосредственно из C :, но из каталога root относительно того, где находится ваш index. html.