Question

* {
    margin: 0;
    padding: 0;
}

body {
    background-color:#357835;
    margin: 40px 0;
    margin-top: -3px;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

}

p, ul {
    text-align: justify;
}
b{
   font:Verdana, Arial, Helvetica, sans-serif;
   color:#00FF33;
    font-size:12px;
}
h4{
    font-size:12px;
    color:#000000;
    margin-top:20px;
}
strong {
    font-weight: bold;


}

a {
    color: #87ddtt;
    text-decoration:none;
}

a:hover {
    text-decoration: none;
    color: #7gr4yy;
}

.row1{

} 
.box1 {

    float:left;
       width:230px;
    height:225px;
    margin-top:10px;

}
.box2 {

    float:left;
       width:230px;
    height:225px;
    margin-top:10px;    

}
.box3 {

    float:left;
       width:230px;
    height:225px;
    margin-top:10px;

}
.row2 {

} 
.box5{
    float:left;
       width:150px;
    text-align:left;
    margin-top:5px;
    margin-right:15px;
}
.box6 {
    float:left;
       width:180px;
    text-align:left;
    margin-top:5px;
    margin-left:35px;
}
.boxgap{
width:13px;
height:295px;
float:left;
margin-top:85px;
background:url(file:///H|/images/vbar300.gif) no-repeat bottom;
}
.details{
     text-align:right;
     margin-right:20px;
     font-family:Verdana, Arial, Helvetica, sans-serif;
     font-size:11px;
     color:#FF9933;
     list-style:none;
     float:right;
}

.bar {
    width:801px;
    height:30px;
    background-color:#FF9933;
    margin-left:0px;
    padding: 0px 0px 5px 0px;
    }
.titletext {
    text-align:center;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size:14px;
    margin-bottom:2px;
    font-weight:600;
    padding: 0px 0px 15px 0px;
}
#page {
    width: 801px;
    margin: 0 auto;
    padding: 0px 0 0 0;
    position:relative;
}
#table {
      background:url(file:///H|/images/tableback680.gif) repeat-x; 
      width:801px;
      height:680px;
      padding: 0px 0px 0 0px;
      margin: 0 auto;
}
/* Header */

#banner {

    width: 801px;
    height: 150px;
    margin: 0 auto;
    margin-top:Opx;
    background-color:#003300;
    background: url(file:///H|/images/banner.jpg);    
    border-bottom: 3px solid #FFFFFF;
     }
#header {
    width: 801px;
    height: 37px;
    margin: 0 auto;
    background-color:#003300;
    background:#9bb143 url(file:///H|/images/img01.gif) repeat-x;
    /*background: #BECF74 url(../images/img01.gif) repeat-x;*/
    border-bottom: 1px solid #FFFFFF;

}

/* Menu */

#menu {
    float:left;
    width: 791px;
    height: 47px;
    margin: 0;
    padding: 0 0 0 10px;
    list-style:none;
    background: url(file:///H|/images/img02.gif) no-repeat;

}

#menu li {
    display:inline;

}

#menu a {
    display: block;
    float: right;
    height: 27px;
    padding: 10px 15px 0px 15px;
    text-transform: lowercase;
    text-decoration: none;
    font-size: 12px;
    font-weight: bold;
    color:#003300;
}

#menu a:hover {
    background: url(file:///H|/images/img04.gif) repeat-x;

}
#menu .current_page_item a {
    background: url(file:///H|/images/img04.gif) repeat-x;
}

#colOne {
    margin-top:0px;
    margin-left:90px;
    width: 800px;
    height:300px;
    padding: 0px 0px 0 0px;

}
#colTwo {
    margin-top:0px;
    margin-left:90px;
    width: 700px;
    height:275px;
    padding: 0px 0px 0 0px;

}

.caption{
     font-family:Georgia, "Times New Roman", Times, serif;
     font-size:14px;
     color:#CC9900;
     text-align:center;

}
/* Footer */

#footer {
    clear: both;
    width: 801px;
    margin: 0 auto;
    padding-top: 0px;
    background: url(file:///H|/images/img12.gif) repeat-x;
}

#footer p {
    margin: 0;
    text-align: center;
    font-size: 11px;
    color:#663366;
}
#footer a{
     font-family:"Trebuchet MS";
     color:#000099;
}
#footer a:hover {
     font:"Trebuchet MS";
     color:#990000;
}

Answer 1

嗯，我不知道你的问题究竟应该是什么，但如果我们在将上述样式表部署到真正的HTTP服务器时讨论问题，那肯定是个问题：

background: url(file:///H|/images/img12.gif) repeat-x;

您的所有网址都指向计算机上的本地文件系统。当您通过HTTP提供页面时，这不起作用，因此图像似乎都将丢失。您需要将该URL指向页面相对地址，可能是：

background: url(/images/img12.gif) repeat-x;

在html页面上调用它时，它无法正常工作

1 个答案: