努力摆脱模板上的黑匣子答案

【问题标题】：Struggling to get rid of a black box on a template努力摆脱模板上的黑匣子
【发布时间】：2012-06-25 00:58:34
【问题描述】：

我对网页设计很陌生。我对服务器端了解更多。我正在制作一个网络摄像头网站； www.camtheplanet.com。我正在使用 Joomla 中的模板，一旦删除徽标，我无法弄清楚如何摆脱留下的黑匣子。您可以在上面的 URL 中看到我在说什么。任何建议将不胜感激。

【问题讨论】：

标签： html css joomla templates

【解决方案1】：

如果您的意思是整个网站上的那个大黑框，就在您的导航栏下方。那是一张大图。确切地说，这是在这个文件中设置的http://camtheplanet.biz.tm/welcome/templates/themza_j15_11/css/blue.css

线13

ID#page_bg: background: white url(../images/blue/bg_page.png) top repeat-x;

如果您使用 Chrome 开发者工具删除该图像，您会看到该图像非常大，并且还包括蓝色导航栏。

图片为 1x920 像素且重复。所以这是一个快速廉价的糟糕设计，因为删除它意味着您必须重做模板中的一些 CSS 和 HTML 以保持导航栏背景（蓝色）并再次做主 bg 区域。

或将page_bg 更改为page_bg_1，您将没有黑色区域。我刚刚看到这个 ID，在您的蓝色导航下方只有一条细黑线

【讨论】：

【解决方案2】：

CSS

您需要编辑背景图片

#page_bg {
    background-attachment: scroll;
    background-clip: border-box;
    background-color: #FFFFFF;
    background-image: url("../images/blue/bg_page.png");
    background-origin: padding-box;
    background-position: center top;
    background-repeat: repeat-x;
    background-size: auto auto;
}

如果你删除background-image: url("../images/blue/bg_page.png");你会看到

【讨论】：