ROR: полноэкранное фоновое изображение - PullRequest
Новая
       1

ROR: полноэкранное фоновое изображение

0 голосов
/ 01 августа 2011

Я пробовал разные варианты, а также те, которые размещены в stackoverflow. Но, похоже, ничего не работает. У меня есть файл logo.png в / public / images и файл custom.css в таблицах стилей.

Я хочу, чтобы фон каждой страницы был logo.png (полный экран)

Я пробовал следующее после большого поиска. Но у меня ничего нет. Фон просто пустой.

Пожалуйста, помогите 

 body{
 background: url('../images/logo.png') repeat-x ;
 text-align:center;
 color:#fff;
 }

Ответы [ 4 ]

0 голосов
/ 01 августа 2011

Вы определенно НЕ хотите использовать repeat-x Чтобы проиллюстрировать почему, используйте следующую ссылку http://www.w3schools.com/css/tryit.asp?filename=trycss_background-image и вставьте приведенный ниже код и посмотрите, что произойдет, затем удалите repeat-x и посмотрите результаты 

<html>
<head>
<style type="text/css">
body {
  color: white;
  background:url('paper.gif') repeat-x;
}
</style>
</head>

<body>
<h1>Hellos World!</h1>
</body>

</html>

Если ваше изображение не отображается после удаления repeat-x, это, скорее всего, будет проблема пути (как уже отмечали другие) или плохое изображение.

Единственное, что есть, - это если в вашем css определены другие классы / div, которые переопределяют свойство background, заданное вами в основном тексте. Другие предложили вам использовать firebug. Я должен от всего сердца согласиться. Firebug очень важен при работе с проблемами HTML и CSS.

Firebug доступен для браузеров Chrome и Firefox (Firefox как плагин, по умолчанию Chrome), но я не уверен в других браузерах.

0 голосов
/ 01 августа 2011

Путь проблема? ^^

Можете ли вы увидеть свое изображение, если просто перейти к нему? Если нет, попробуйте использовать firebug , чтобы увидеть, в чем проблема, и легко решить ее.

Фоновое изображение на весь экран:

Я нашел интересную статью о css-трюках, может быть полезной, автор предлагает несколько решений.

0 голосов
/ 01 августа 2011

Есть плагин JQuery, который я использовал для полноэкранных фоновых изображений, и он называется bgStetcher . Вы можете использовать его для растягивания фоновых изображений на весь экран. Этого нельзя сделать в CSS.

0 голосов
/ 01 августа 2011

Вместо repeat-x поставить repeat.Кроме этого проверьте правильность пути к вашему изображению.

...