CSS фон не отображается

-2

<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 CSS фон не отображается

По какой-то причине, изображение не загружается вообще, несмотря на то, если я открываю url в новой вкладке, он загружается должным образом. Когда я меняю изображение на что-либо еще в одной папке, он работает.

Я чувствую, что мне не хватает чего-то невероятно элементарного здесь.

источник

2015-04-20 Sefam

положить 'фон: URL()' внутри кавычек: 'фон: URL ('/ изображения/advert_bubble_arrow.png') не повторять 0 0;' и проверьте, что файл существует на images/advert_bubble_arrow.png – Martin

Здесь хорошо выглядит http://jsfiddle.net/7d6qoeha/ –

@Martin, не нуждается в двойных кавычках, отлично работает без него –

Вам необходимо объявить ID, что он не отображается, потому что идентификатор не определен. чтобы определить это сделать

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

источник

2015-04-20 17:23:00

CSS фон не отображается

ответ

Смежные вопросы