首页 文章

Chrome和Safari上的自定义背景图片的Blogger问题

提问于
浏览
1

这很奇怪,有问题的网站是blog.andrebatista.info,它是在blogger.com上托管的 . 我正在尝试使博客模板看起来与我主网站中的模板相同,www.andrebatista.info .

出于某种原因,如果我直接访问博客地址Chrome和Safari无法显示我的所有背景图片...所有这些 .

但是,如果我首先去www.andrebatista.info然后去博客它渲染得很好?¿

我自定义它的方法是在博客模板的head标签的最末端添加一个指向我的主站点样式表的链接 . 该样式表如下所示:

  • {保证金:0;填充:0;边界:0; }
html,body {
 background:#064169 url(http://www.andrebatista.info/images/main_gradient_slice.jpg) repeat-x;
 font-family: Arial, "MS Trebuchet", sans-serif;
 font-size:18px;
}

#main_wrapper{
 margin: 0 auto;
 width:1024px;
}
 #header{
  background: url(http://www.andrebatista.info/images/header.jpg);
  height:133px;
  border:none;
  margin:0;
 }

 #menu_wrapper{
  background: url(http://www.andrebatista.info/images/menu.jpg);
  height:34px;
  overflow:hidden;

 }
  #menu_wrapper .menu_item{
   color:white;
   float: left;
   border: 1 px solid red;
   height: 34px;
   padding-top:10px; 
   text-align:center;
   width:100px;

  }

  #menu_wrapper .first{
   padding-left:240px;
   float:left;
   width:100px;

  }
  #menu_wrapper .active,#menu_wrapper .menu_item:hover{
   background-color:white;
   color:Teal;
   cursor: pointer;
  }

 #content_area_wrapper{
  background: url(http://www.andrebatista.info/images/body_bg_slice.jpg) repeat-y;
 }
  #content_area{
   min-height:524px;
   background: url(http://www.andrebatista.info/images/main_content_top.jpg) repeat-x;
  }
   #main_banner{
    background: url(http://www.andrebatista.info/images/main_banner.jpg) no-repeat center center;
    width:662px;
    height:338px;
    margin: 0 auto;

   }
   #main_banner div{
    color:white;
    padding-left:47px;
    padding-right:164px;
    padding-top:105px;
   }
   #text_area{
    overflow:hidden;
    width:662px;
    margin:0 auto;
    padding:14px;
   }
    #contentList{
     padding:0 20px 20px 20px;
    }
    #text_area .left{
     width:50%;
     float:left;
    }
    #text_area .left{
     width:50%;
     float:right;    
    }

 #footer2{
  background: url(http://www.andrebatista.info/images/footer.jpg);
  height:62px;
 }

 #footer{
  background: url(http://www.andrebatista.info/images/footer.jpg);
  height:62px;
 }

关于我可能遗失的任何想法?

3 回答

  • 0

    这不是您的博客托管的CSS或服务器的问题,而是托管您的网站的服务器的问题 . 当我使用Fiddler检查流量时,我会得到这些响应,而不是图像:

    HTTP/1.1 302 Found
    Date: Fri, 05 Mar 2010 23:43:52 GMT
    Server: Apache
    Location: http://www.hosting.zymic.com/403
    Content-Length: 216
    Content-Type: text/html; charset=iso-8859-1
    Via: 1.1 www.andrebatista.info
    Connection: close
    
    <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
    <html><head>
    <title>302 Found</title>
    </head><body>
    <h1>Found</h1>
    <p>The document has moved <a href="http://www.hosting.zymic.com/403">here</a>.</p>
    </body></html>
    

    我猜这是基于Referer Headers 的某种反链接措施的结果 .

  • 1

    好吧,当我去Firefox时,我得到一个错误,说“没有帖子符合我的查询”,这让我想知道你的服务器是否设置不正确 .

    编辑:在Chrome中也是如此

  • 2

    尝试将URL放在引号中 . (如果它不是服务器问题,就像在另一个答案中那样,webkit可能会在'://'上窒息 . )

    background:#064169 url("http://www.andrebatista.info/images/main_gradient_slice.jpg") repeat-x;
    

    更多信息:CSS background-image - What is the correct usage?

相关问题