Как я могу повторить фоновое изображение только на моем макете сайта. Мое изображение составляет 1 пиксель в ширину и 400 пикселей в высоту, и я хотел, чтобы оно составляло 100% ширины экрана.
Я думал, что это был...
CSS:
#bg-image {
background-image: url("images/bg.png")
background-repeat:repeat-y;
background-size: 100%;
}
HTML:
<div class="wrapper">
<div class="bg-image">
</div>
</div>
Но это не работает. Я просмотрел другие ответы StackOverflow, но не смог найти такой же, как у моей проблемы. Любая помощь приветствует приветствия
Попробуй это:
#bg-image
{
background-image:url('paper.gif');
background-repeat:repeat-y;
height: 100%;
}
Попробуйте этот код для повторного горизонтального изображения.
repeat-x : Work for Horizontal
repeat-y : Work for Vertical
'CSS
#bg-image {
background-image: url("images/bg.png")
background-repeat:repeat-x;
background-size: 100%;
}
HTML:
<div class="wrapper">
<div class="bg-image">
</div>
</div>
Попробуйте дать height:auto
в Div, где применяется фоновое изображение, и включать его под Div, где вы хотите его расширить.
<div class="OuterDiv">
<div class="backgroundImage"></div>
</div>
CSS
.OuterDiv
{
height:100%;
}
.backgroundImage
{
background-image:url('someimage.png') repeat-x;
height:auto;
}
Можете ли вы попробовать это,
#bg-image {
background-image: url("images/bg.png");
height: 100%;
}
Я думаю, вы смутили X
с Y
Вы должны использовать:
#bg-image {
background-image: url("images/bg.png");
background-repeat: repeat-x;
}
body { background: url(../images/bg.png); }