2017-12-04 2 views
0

템플릿에있는 개체의 각 인스턴스에 대해 사진을 표시하기 위해 연결된 ImageField의 URL을 추출하고 싶습니다. 하지만 인라인 스타일링없이 할 수있는 방법 찾는 데 문제 :이 템플릿에 각각의 이미지를 가져 작동인라인 스타일을 피하고 템플릿 언어를 활용하려면 어떻게해야합니까?

{% for entry in entries %} 
     <div class="row"> 
     <div class="col s4"> 
      <div class="card-panel" style="background-image: url('{{entry.image.url}}');"> 

     <h1>{{entry.title}}</h1> 

     </div></div></div> 
    {% endfor %} 

,하지만 난 도망 추상적 인 CSS를 그냥 내 CSS를 유지하기 위해 할 수 있는지 궁금해 별도의 파일.

편집 : 동일은 <img> 태그 간다 :

<img src="{{ entry.image.url }}">

이 템플릿에 동적 될 것입니다. 하지만 이것을 설정할 수 없다. background-image

+0

'

+0

@RajaSimon same situation for the 태그를 사용하십시오. 게시물에서 예제로 편집합니다 – Homer

+2

정적 CSS를 사용하여 동적 스타일을 만들 수있는 방법은 없습니다. –

답변

1

장고 템플릿 시스템을 사용하여 CSS를 렌더링하고 동적 CSS 파일을 만들 수 있습니다. 나는 이것을하는 것을 권장하지 않지만, 당신이 정말로 원한다면 그것을 일반 URL /보기처럼 설정할 수 있습니다.

는 예를 들어, urls.py 그런 다음 템플릿에서 당신이 가진 수있는 그런 다음 뷰가 보일 것이다

def dynamic_style(request, pk): 
    entry = get_object_or_404(Entry, pk) 

    return render_to_response('dynamic_style.css', { 
     'image_url': entry.image.url 
    }, content_type='text/css') 

같은 것을이

url(r'^dynamic_style/(?P<pk>\w+)$', dynamic_style, name='dynamic')

같은 것을했을

<link href="{% url 'dynamic_style' pk=entry.id %}" rel="stylesheet"> 

이것은 CSS를 생성하는 어지러운 방법입니다. 위에서 제안한대로 인라인을 사용할 수 있다면 훨씬 좋습니다.

관련 문제