background image does not work external css

Question

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

background:url(pics/alexlogo1.png); 0 0 no-repeat; 

Я также попытался

background:url(/pics/alexlogo1.png); 0 0 no-repeat; 

и

background:url(.../pics/alexlogo1.png); 0 0 no-repeat; 

Но я не могу заставить его работать, когда во внешнем файле CSS но он отлично работает, когда в главном теге.

Большое спасибо заранее

Answer 1

Если у вас есть стиль в файле CSS, то URL является относительно файла CSS, а не страницы, где он используется.

Вы должны использовать два периода, чтобы получить уровень вниз, а не три:

background:url(../pics/alexlogo1.png) 0 0 no-repeat; 

(. Кроме того, не точка с запятой после url(), когда у вас есть дополнительные настройки фона)

---

Другие имеют предложили добавить кавычки вокруг URL-адреса, но это не так просто для URL-адреса. Кавычки (или апострофы) являются необязательными в соответствии с the specification и нужны только тогда, когда URL содержит специальные символы, которые иначе разрушали бы синтаксис CSS.

Answer 2

Try окружающих свой путь в кавычки, например:

background:url("/pics/alexlogo1.png") 0 0 no-repeat; 

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

background:url("../pics/alexlogo1.png") 0 0 no-repeat; 

Для того, чтобы оставить css folder с .. и войти в папку с pics/pics.

Пример: C: \ CSS \ style.css и С: \ фото \ alexlogo1.png

C:\css\style.css 
    .. -> C:\ 
    /pics -> C:\pics` 
    /alexlogo1.png -> C:\pics\alexlogo1.png 

Answer 3

background:url("../pics/alexlogo1.png") 0 0 no-repeat; 

использовать только .. (два периода) для относительных URL-адресов.

Answer 4

Эй у вас есть синтаксическая ошибка!

ИЗВЛЕКИТЕ ; после )

background:url(.../pics/alexlogo1.png); 0 0 no-repeat; 

он должен выглядеть следующим образом

background:url(.../pics/alexlogo1.png) 0 0 no-repeat;