Django - How to display image file in template

What I am trying to accomplish?: I uploaded multiple images(3) and I am trying to display each images in different image tag. Here is my code;

How are you doing it?: I have attached my code to the question and explained the difficulties I have found in the code.

codes below;

Models.py

class MultipleFile(models.Model):
  post = models.ForeignKey(Post, on_delete=models.CASCADE, null=True, blank=True)
  files = models.FileField(upload_to ='PostImages/%Y/%m/%d/', null=True, blank=True)
  is_image = models.BooleanField(default=False)
  is_video = models.BooleanField(default=False)

Views.py

def ForYouView(request):
  page_title = "For You"

  #All posters posts
  poster_profile = Post.objects.filter(
      Q(poster_profile=request.user))

  #Post form    
  if request.method == "POST":
      form = PostForm(request.POST)
      form_upload = MultipleFileForm(request.POST, request.FILES)

      if form.is_valid() and form_upload.is_valid():
          post = form.save(commit=False)
          post.poster_profile = request.user
          post.save()
          form.save_m2m()

          my_files = request.FILES.getlist('files')
          for items in my_files:
              post_files = MultipleFile.objects.create(post=post, files=items)

              # Determine if it's an image or video based on mime type
              mime_type, _ = mimetypes.guess_type(post_files.files.name)
              if mime_type and mime_type.startswith('image/'):
                  post_files.is_image = True
              elif mime_type and mime_type.startswith('video/'):
                  post_files.is_video = True

              post_files.save()
          return redirect('site:foryou_view')
        
  else:
      form = PostForm()
      form_upload = MultipleFileForm()  

  context = {
      'page_title': page_title,
      'poster_profile': poster_profile,
      'form': form,
      'form_upload': form_upload,
  }
  return render(request, 'foryou.html', context) 

Template.html

{% if poster_profile  %}
{% for user in poster_profile %}
{% if user.multiplefile_set.all|length == 3 %}

{% for field in user.multiplefile_set.all %}

#I want the first image to display on this tag
{% if field.is_image == True %}
<img src="{{ field.files.url }}" alt="img"/>
{% endif %}

#I want the second image to display on this tag
{% if field.is_image == True %}
<img src="{{ field.files.url }}" alt="img"/>
{% endif %}

#I want the third image to display on this tag
{% if field.is_image == True %}
<img src="{{ field.files.url }}" alt="img"/>
{% endif %}
{% endfor %}

{% endif %}
{% endfor %}
{% endif %}

What I have tried but not working for me:

#I want the first image to display on this tag
{% if field.0.is_image == True %}
<img src="{{ field.files.url }}" alt="img"/>
{% endif %}
#I want the second image to display on this tag
{% if field.1.is_image == True %}
<img src="{{ field.files.url }}" alt="img"/>
{% endif %}
#I want the third image to display on this tag
{% if field.2.is_image == True %}
<img src="{{ field.files.url }}" alt="img"/>
{% endif %}

However, it does not work. Images do not appear. Any suggestions ?

{% for field in user.multiplefile_set.all %}
  {% if forloop.counter0 == 0 %}
    <!-- First Image tag -->
    {% if field.is_image %}
      <img src="{{ field.files.url }}" alt="Image 1"> 
    {% endif %}

  {% elif forloop.counter0 == 1 %}
    <!-- Second Image tag -->
    {% if field.is_image %}
      <img src="{{ field.files.url }}" alt="Image 2">
    {% endif %}

  {% elif forloop.counter0 == 2 %}
    <!-- Third image tag -->
    {% if field.is_image %}
      <img src="{{ field.files.url }}" alt="Image 3">
    {% endif %}

  {% else %}
    <!-- Whatever you want to do past 3 -->
    <img src="{{ field.files.url }}" alt="Image {{ forloop.counter }}">
  {% endif %}
{% endfor %}