CSS背景没有显示出来

时间:2015-04-20 16:31:50

标签: html css

<div id="advert_bubble">
        <div class="advert_bubble_box">
            <p> Text Here </p>
        </div>
        <div class="advert_bubble_arrow"> </div>

</div>

div#advert_bubble{
    width: 400px;
    min-height: 300px;
    position: relative;
    float: left;
    clear: left;
}

    div#advert_bubble div.advert_bubble_box{
        float: left;
        clear: left;
        width: 300px;
        height: 200px;
        border-radius: 25px 25px 25px 25px;
        -moz-border-radius: 25px 25px 25px 25px;
        -webkit-border-radius: 25px 25px 25px 25px;
        border: 1px solid #000000;
        -webkit-box-shadow: 7px 7px 5px 0px rgba(0,0,0,0.4);
        -moz-box-shadow: 7px 7px 5px 0px rgba(0,0,0,0.4);
        box-shadow: 7px 7px 5px 0px rgba(0,0,0,0.4);
        background-color: white;
        position: absolute;
        z-index: 5;
    }

    div.advert_bubble_arrow{
        position: absolute;
        width: 41px;
        height: 39px;
        background: url(/images/advert_bubble_arrow.png) no-repeat 0 0;
        z-index: 10;
    }

我有这个HTML和这个CSS标记,我有这个图像:http://i.imgur.com/cJWhXCh.png

出于某种原因,图像根本没有加载,即使我在新标签中打开网址,它也会正确加载。当我将图像更改为同一文件夹中的任何其他内容时,它可以正常工作。

我觉得我在这里错过了一些非常小的东西。

1 个答案:

答案 0 :(得分:0)

您需要声明ID未显示,因为未定义ID。定义它做这个

&#13;
&#13;
<html>
  <Head>
    <title></title>
    <!--This is where you declare your IDs-->
    <script type="text/javascript">
     //looks for Id's here so declare them
      function Idgoeshere()
      //looks for the id.
      {
      document.getElementById
      //after the Id you say what it does.
}
      </script>

</head>
  <body>










div id="advert_bubble">
        <div class="advert_bubble_box">
            <p> Text Here </p>
        </div>
        <div class="advert_bubble_arrow"> </div>

</div>

div#advert_bubble{
    width: 400px;
    min-height: 300px;
    position: relative;
    float: left;
    clear: left;
}

    div#advert_bubble div.advert_bubble_box{
        float: left;
        clear: left;
        width: 300px;
        height: 200px;
        border-radius: 25px 25px 25px 25px;
        -moz-border-radius: 25px 25px 25px 25px;
        -webkit-border-radius: 25px 25px 25px 25px;
        border: 1px solid #000000;
        -webkit-box-shadow: 7px 7px 5px 0px rgba(0,0,0,0.4);
        -moz-box-shadow: 7px 7px 5px 0px rgba(0,0,0,0.4);
        box-shadow: 7px 7px 5px 0px rgba(0,0,0,0.4);
        background-color: white;
        position: absolute;
        z-index: 5;
    }

    div.advert_bubble_arrow{
        position: absolute;
        width: 41px;
        height: 39px;
        background: url(/images/advert_bubble_arrow.png) no-repeat 0 0;
        z-index: 10;
    }
  </body>
</html>
&#13;
&#13;
&#13;