CSS Sprite垂直重复问题
我正在尝试在我的 web 应用程序中包含 css 精灵。问题是我已经将我的网站背景垂直排列在精灵图像中。现在,精灵的一部分需要垂直重复。
我正在尝试以下代码...
#page-wrapper {
margin: 0px auto;
background-image: url(../images/background.png);
height: 100%;
width: 1000px;
}
#page-wrapper #content {
background-position: 0px -80px;
background-repeat: repeat-y;
height: 1px;
}
我对内容类的高度属性感到困惑。我应该如何定义我想要重复的部分的高度和 div(#content) 的高度?
问候 维克拉姆
I am trying to include css sprites in my webapp. The thing is I have arranged my website background vertically in sprite image. Now, one portion of the sprite needs to be repeated vertically.
I was trying the following code...
#page-wrapper {
margin: 0px auto;
background-image: url(../images/background.png);
height: 100%;
width: 1000px;
}
#page-wrapper #content {
background-position: 0px -80px;
background-repeat: repeat-y;
height: 1px;
}
I am confused in the height property of content class. How should I define the height of the section which I want to repeat and the height of the div(#content)?
Regards
Vikram
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
如果精灵在图像中水平排列,则可以垂直重复精灵。
You can repeat the sprite vertically if your sprites are arranged horizontally in the image.
您不能在背景中重复图像的一部分。设置高度只会更改
#content
元素的高度。图像总是完全重复。You can not repeat part of an image in the background. Setting the height only changes the height of the
#content
element. The images is always repeated completely.