ЗАДАЧА В PYTHON + HTML. КАК СДЕЛАТЬ ЧТОБЫ НАЖАВ НА ЛЮБУЮ КАРТИНКУ
Дата публикации:

ЗАДАЧА В PYTHON + HTML. КАК СДЕЛАТЬ ЧТОБЫ НАЖАВ НА ЛЮБУЮ КАРТИНКУ


ЗАДАЧА В PYTHON + HTML. КАК СДЕЛАТЬ ЧТОБЫ НАЖАВ НА ЛЮБУЮ КАРТИНКУ ОТКРЫВАЛАСЬ НОВАЯ СТРАНИЦА С ОПИСАНИЕМ ЭТОЙ КАРТИНИКИ? КАРТИНКИ В ЦИКЛЕ, А КАК СДЕЛАТЬ НА КАЖДУЮ НЕ ПОЙМУ. ВСЕГО БУДЕТ 4 ТОВАРА{% extends 'base.html'%}{% block title %}Наши товары{% endblock %}{% block main %} <div id="cards"> {% for c in cards %} <div class="prod_card"> <div class="card_img"> <img src="/static/img/{{c.img}}" alt=""> </div> <div class="card_text"> <h3>{{ c.name }}</h3> <p>{{ c.price }}</p> </div> </div> {% endfor %} </div>{% endblock %}

Чтобы сделать так, чтобы при нажатии на любую картинку открывалась новая страница с описанием этой картинки, вам потребуется внести следующие изменения в ваш код:

  1. В HTML-коде добавьте ссылку на новую страницу с описанием картинки, используя тег <a>. Внутри этой ссылки поместите тег <img>, чтобы отобразить картинку. Пример:
<div id="cards">
    {% for c in cards %}
        <div class="prod_card">
            <div class="card_img">
                <a href="/description/{{ c.id }}">
                    <img src="/static/img/{{ c.img }}" alt="">
                </a>
            </div>
            <div class="card_text">
                <h3>{{ c.name }}</h3>
                <p>{{ c.price }}</p>
            </div>
        </div>
    {% endfor %}
</div>
  1. В вашем Python-коде создайте новый маршрут /description/<id>, который будет отвечать за отображение страницы с описанием картинки. Пример:
from flask import Flask, render_template

app = Flask(__name__)

@app.route('/description/<int:id>')
def description(id):
    # Здесь можно добавить код для получения описания картинки по ее id
    # и передать его в шаблон description.html
    return render_template('description.html', id=id)

if __name__ == '__main__':
    app.run()
  1. Создайте новый шаблон description.html, в котором будет отображаться описание картинки. Пример:
{% extends 'base.html' %}

{% block title %}Описание картинки{% endblock %}

{% block main %}
    <h1>Описание картинки {{ id }}</h1>
    <!-- Здесь можно добавить код для отображения описания картинки -->
{% endblock %}

Обратите внимание, что в примерах выше используется фреймворк Flask для создания веб-приложения на Python. Если вы используете другой фреймворк или подход, то код может отличаться.