2013-11-07 3 views
0

Я хотел бы использовать таблицу стилей для установки фонового изображения в моей DIV на странице html.CSS: установить фоновое изображение с помощью CSS

Мой CSS файл:

#MyDiv { 
background-image: url('Images/prechod.png'); 
background-repeat: repeat-x; 
height: 400px; 
} 

И моя страница:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <link href="Css/StyleSheet1.css" rel="stylesheet" /> 
    <title></title> 
</head> 
<body> 
    <div id="MyDiv"> 
    </div> 
</body> 
</html> 

Я попытался также это и работает.

<body> 
    <div style="height: 400px; background-image: url('Images/prechod.png'); background-repeat: repeat-x"> 

    </div> 
</body> 

Но я хотел бы иметь все в файле css. Надеюсь, это просто, и кто-то мне поможет.

+0

Может быть, у вас есть проблемы с дорожками (против «Images» «изображений»)? Проверьте с помощью инструментов разработчика браузера, если это изображение находится в браузере. – Volvox

ответ

3

Дорожки в вашем файле CSS является относительно расположения файла CSS, а не HTML файла.

Вы, вероятно, просто нужно изменить CSS соответственно - к примеру, если ваш файл CSS в Css/StyleSheet1.css относительно HTML-файла, просто измените его следующим образом:

#MyDiv { 
    background-image: url('../Images/prechod.png'); 
    background-repeat: repeat-x; 
    height: 400px; 
} 

Если это не проблема путь , скорее всего у вас есть другой стиль более высокой специфичности, переопределяющий объявление #myDiv в вашем файле CSS (например, что-то вроде body #myDiv { background: none } или тому подобное). Это объясняет, почему он работает как встроенный стиль (поскольку они имеют самую высокую специфичность), но не в вашей таблице стилей. Однако, основываясь на том факте, что ваш путь был неправильным для начала, я подозреваю, что это преступник.

+1

OK ... Я глуп, и мне пришлось ехать домой сегодня :) Спасибо –

+0

@JendaMatejicek не проблема! Мы все тратим время на отладку глупых оплошностей! Отметьте один из них как ответ, когда вы получите шанс, пожалуйста :) – Ennui

2
background-image: url('../Images/prechod.png'); 

Путь должен быть установлен по отношению к CSS

+0

ОК ... Я глуп, и мне пришлось идти домой сегодня :) Спасибо –

1

Относительные пути в CSS, а затем добавляя те там:

/** CSS **/ 
#MyDiv { url('../Images/prechod.png') repeat-x; height: 400px; } 
Смежные вопросы