2014-07-25 3 views
0

나는 이것에 문제가 있어요 - 사실 내가 URL에 결과를 붙여 내가 이미지가 확실히있는 소스보기로 이동하면 이미지가이미지 Laravel에 표시되지 않는 4

<div class="carousel-inner"> 
     @foreach ($model->pictures as $picture) 

      <div class="fill" 
       style="background-image:url({{ URL::asset($picture->path) }});"> 
       </div> 

      <!-- {{ HTML::image($picture->path)}} -->   
     @endforeach 
    </div> 

표시되지 않으며, 공장. 그런데 예제에서는 작동하는 주석 처리 된 선이 있지만 실제로 HTML 태그가 아닌 div에 배경 이미지가 필요합니다. 무엇이 될 수 있습니까?

CSS에 채우기 클래스 :

.fill { 
     width:100%; 
     height:100%; 
     background-position: center; 
     background-size: cover; 
    } 

답변

0

이 클래스가 "채우기"높이도 폭이없는 것 같다. 크기가없는 요소의 배경을 정의하기 때문에 요소 자체 (예 : div)가 표시됩니다.

이 같은 폭과 높이를 정의하여이 문제를 해결할 수 있습니다

<div class="fill" 
    style="background:url({{ URL::asset($picture->path) }}); no-repeat; 
      background-size:269px 95px;height:95px;width:269px"> 
</div> 
+0

너비와 높이를 100 %에서 100px로 변경하고 작동하는지 확인할 수 있습니까? –

0

이 시도 :

<div style="height:100px;width:100px;background-image:url('{{ asset('http://www.example.com/images/image.png') }}'); border-radius: 5px;position:relative"> 

를 사용하는 대신 :

URL::asset($picture->path 

당신은을 사용할 수 있습니다 absolute 이미지의 경로. 이미 background-image을 위해 그것을 사용하고 있기 때문에 인라인 스타일을 피하기 위해 더 나은을하지만, : 또한

http://www.example.com/images/image.png 

px 대신의 %

참고 width를 사용해보십시오 : 예를 들어

, 나는 앞으로 나아갈 것이다!

관련 문제