项目中遇到一个关于使用图片作背景的问题。

在我的电脑中查看时,一切显示的是正常的,但是到了同事那边,因为他的显示器比我的大,所以在他那里就是页面的一大部分是我定义的背景图片,页底的一小部分是白色的。

我之前定义的class是:

body {
    background: url("../images/line.jpg") repeat-x;
}

后来定义为

body {
    background: url("../images/line.jpg") repeat-x scroll 0 0 #0096C2;
}
    • 前一个class没有定义#0096C2;只是定义了repeat-x,在x方向上重复。
    • 图片line.jpg的高度是275px,也就是说页面的背景图片只有275的高度,一旦高度高于275px,那多出来的部分就显示的是浏览器默认的body的颜色。
    • 后一个class添加了#0096C2;这个颜色值取的是图片最低端的颜色,这样页面多出来的那部分就会显示这个颜色值(我使用的图片是渐变的)
    • 因为使用的图片是渐变色的,不要使用repeat-y。

相关文章:

  • 2021-07-08
  • 2022-12-23
  • 2021-10-17
  • 2021-10-23
  • 2022-12-23
  • 2021-12-10
猜你喜欢
  • 2021-05-17
  • 2022-01-02
  • 2021-12-22
  • 2022-12-23
  • 2021-12-25
  • 2022-12-23
  • 2021-03-30
相关资源
相似解决方案