Question

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

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

HTML code：

<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;
}

有人发现它有任何问题吗？

Answer 1

将其写为 -

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

编辑：

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

点击此处JSFiddle

Answer 2

的 Demo 的

您好现在在overflow:hidden; ID
中定义#body-1
就像这样

#body-1 { overflow:hidden; }

的 Live demo 的

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

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

第二是

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

的 Live demo 的

Answer 3

请试试这个

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

背景图形没有显示

3 个答案:

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

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