이미지가 깨졌습니다

-2

이미지가 손상되었습니다. 내가 photo.html에 쓴이미지가 깨졌습니다

{% extends "registration/accounts/base.html" %} 
    {% block content %} 
    <div class="container"> 
     <h2 class="page-header">{{ photos.title }}</h2> 
     <div class="row"> 
     <div class="col-xs-4"> 
      <img class="img-responsive" src="/media/{{ photos.image }}"> 
     </div> 
     </div> 
     <a class="btn btn-primary" href="{% url 'accounts:upload' photo.id %}">UPLOAD</a> 
    </div> 
{% endblock %}

나는 그것을 고칠 수 why.How 모르겠어요? "img 태그"가 잘못 되었습니까? DOM가 준비되면 이미지 URL이 생성 확인

출처

2017-02-06 lili

'어쩌면 당신의'클래스 =의 원인 "IMG는 응답"? –

금이 간다는 것은 무엇을 의미합니까? –

@ ZagorodniyOlexiy thx, ur comments. 그래서, 어떻게 해결해야합니까? – lili

처럼

"금"의 의미입니다.

깨진 이미지 아이콘을 클릭하십시오.
오른쪽 클릭> 요소 검사
URL을 확인하십시오.

URL이 정확한 경우 .. 네트워크 요청 패널을 확인하여 이미지로드 여부를 확인하십시오.

일부 오류가 발생했을 수 있습니다. 서버 또는 CORS 문제에서 이미지를 찾을 수 없습니다.

출처

2017-02-06 13:22:04

thx ur comments.URL을 확인한 결과 src가 잘못되었음을 알았습니다. 이미지는 이미지 (하위 앱 이름)/이미지에 있으므로 디렉터리를 지정하고 싶지만 그렇게하는 법을 모르겠습니다. 방법을 말해 주시겠습니까? – lili

didn; t 폴더 구조를 정확하게 얻습니다. 그러나 src 앞에 "../"를 사용하면 하나의 디렉토리로 되돌아 갈 수 있습니다 .. src = "../ media/{{photos.image}}" –

귀하의 HTML 태그는 다음과 같아야합니다

<img class="img-responsive" src="photo.image.url">

출처

2017-02-06 13:22:10

photos.image 참조 이미지 파일 자체가 아니라 이미지에 URL을. 당신은 이미지 URL photo.image.url를 사용해야합니다 :

<img class="img-responsive" src="{{ photos.image.url }}">

출처

2017-02-06 13:33:28

이미지가 깨졌습니다

답변

관련 문제