1

我的身体背景没有显示。半小时前它工作正常，我不明白为什么它没有在 IE 9 或 Chrome 中显示。它在 Expression Web 4 的预览中显示良好。

它应该看起来像这样 >> http://imageshack.us/photo/my-images/31/screenshotlrj.jpg/

HTML 代码：

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Chinatown</title>
<link href="main.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="body-1">
    <div id="header">
        <img height="315" src="images/Chinatown-header.png" width="850" />
    </div>
    <div id="title-1">
        <p>We is pleased to announce the launch of our Social Enterprise - Experience Chinatown</p>
    </div>
    <div id="maindescription-1">
        <p>RTE are conducting unique tours to celebrate Chinatown, the beating heart of our culture in.  We will be 
        taking people on a journey through Chinatown on a guided tour about the stories of the locals and pioneers that
        made Chinatown what it is today, and then expanding the experiences with tasting tours of the variety of delicious cuisines
        on offer.  Please see below for more information:</p>
    </div>
</div>
</body>
</html>

CSS：

html,
body {
    margin:0;
    padding:0;
    color:#000;
    background: #9c0000;
}
p {
    margin : 0;
    padding : 0;
}
#body-1 {
    width: 870px;
    margin: 0 auto;
    background: #9c0000;
    background-image: url('images/Chinatown-bg.png');
}
#header {
    padding:10px;
    background:#bc0000;
}
#title-1 {
    font: normal normal bold 100% "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
    float: left;
    width: 850px;
    padding: 0 10px 10px 10px;
    color: #FFFF00;
    text-align: justify;
    vertical-align: top;
}
#maindescription-1 {
    font: 100% "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
    float: left;
    width: 850px;
    padding: 0 10px 10px 10px;
    color: #FFFFFF;
    text-align: justify;
    vertical-align: top;
}

有人看到它有什么问题吗？

4

3 回答 3

1

写成——

#body-1 {
    width: 870px; height: 500px;
    margin: 0 auto;
    background: url('images/Chinatown-bg.png') #9c0000 no-repeat left top;
}

编辑：

它必须隐藏在那里。尝试为 ID 设置一些高度 -

在这里检查JSFiddle

于 2012-09-25T10:57:15.243 回答
0

演示

您好，现在overflow:hidden;在您的#body-1 id中定义

像这样

#body-1 {
   overflow:hidden;
 }

现场演示

----------------------------

----------------------

其次是

#body-1:after{
content:'';
  clear:both;
  overflow:hidden;
display:block;
}

现场演示

于 2012-09-25T11:22:28.840 回答
-1

请试试这个

#body-1 {
    width: 870px;
    margin: 0 auto;
    background: #9c0000 url('images/Chinatown-bg.png')  no-repeat 0 0;
}
于 2012-09-25T11:08:09.700 回答