0

我在 phpbb 论坛上使用 CSS，我正试图让我的背景适合。

如果您想查看它在做什么，该站点是http://bofb.org 。

无论如何，我试图让背景拉伸页面，但为不同的浏览器尺寸设置最小宽度。

我试过这个：

body {
    /* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
    font-family: Verdana, Helvetica, Arial, sans-serif;
    color: #828282;
    background-color: #FFFFFF;
    /*font-size: 62.5%;          This sets the default font size to be equivalent to 10px */
    font-size: 10px;
    margin: 0;
    padding: 12px 0;
    background-image: url("{T_THEME_PATH}/images/bg_wrap.png") no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

我的图像根本没有显示。我从这个网站得到这个。

如果我这样做：

body {
    /* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
    font-family: Verdana, Helvetica, Arial, sans-serif;
    color: #828282;
    background-color: #FFFFFF;
    /*font-size: 62.5%;          This sets the default font size to be equivalent to 10px */
    font-size: 10px;
    margin: 0;
    padding: 12px 0;
    background-image: url("{T_THEME_PATH}/images/bg_wrap.png");
   background-size:100%;
}

在您获得较低分辨率的屏幕或缩小窗口之前，它会显示良好。

理想情况下，我希望将其设置在页面中心的特定宽度并重复，但我也没有让它工作。

有人有什么建议吗？

4

4 回答 4

1

这应该完全像你想要的那样工作。但是你需要定义一个背景颜色，这样背景图像就不会在大屏幕上被截断。

background: url("./styles/reds/theme/images/bg_wrap.png") repeat-y center center fixed;

因为你还没有接受我的回答（这是正确的），所以这里是正文的完整样式类：

body {
    font-family: Verdana, Helvetica, Arial, sans-serif;
    color: #828282;
    background-color: #FFFFFF;
    font-size: 10px;
    margin: 0;
    padding: 12px 0;
    background: url("./styles/reds/theme/images/bg_wrap.png") repeat-y center center fixed; 
}

更改背景颜色以删除白色边框并删除 html{ .. } css 类 plz。html 标签不应该被设置样式

于 2013-01-07T16:49:24.800 回答
0

我在 phpbb 中有一个不适合整个屏幕的图像背景。我在正文和 html 中都添加了 100% 的宽度和高度，但它没有修复它。最后，我也为 html 元素定义了背景图像，而不仅仅是正文。似乎成功了。

于 2013-04-13T10:40:48.327 回答
0

在CSS中添加

body, html{
    width:100%;
    height:100%
}

第二次尝试：

html{
    width:100%;
    height:100%;
}
body {
    /* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
    font-family: Verdana, Helvetica, Arial, sans-serif;
    color: #828282;
    background-color: #FFFFFF;
    /*font-size: 62.5%;          This sets the default font size to be equivalent to 10px */
    font-size: 10px;
    margin: 0;
    padding: 12px 0;
    background: url("{T_THEME_PATH}/images/bg_wrap.png") no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width:100%;
    height:100%;
}
于 2013-01-07T16:44:32.007 回答
0

您从 css-tricks 获取的 css 未正确复制。尝试使用背景：，而不是背景图像：

于 2013-01-07T16:47:01.697 回答