python - 在 python django 中修改了带有图标的选择

Question

我有一个关于 python django 模板的问题，并且有点迷失了如何做到这一点。有人可以帮助我了解我将如何调整 {{ poll_form.category }} （这是选项列表）和 {{ poll_form.rating_option }} （选项列表）的css。我想将图标放在选项之上，例如在 facebook 中：

当我点击微笑图标时，我的 {{ poll_form.category }} 会有一个下拉选项。

以下是目前我的表格的样子：

哦。有人对此有任何想法或教程，请提供帮助或给我链接..

先感谢您。

这是我在 home.html 中的表格：

               <div class="panel panel-default">
                <div class="panel-body" >
                    {% for error in poll_form.non_field_errors %}
                    <div class="alert alert-danger alert-dismissable">
                        {{ error }}
                    </div>
                    {% endfor %}
                    {% for field in poll_form %}
                    {% if field.errors %}
                    <div class="alert alert-danger alert-dismissable">
                        {{ field.label }} : {{ field.errors }}
                    </div>
                    {% endif %}
                    {% endfor %}

                    <form role="form" action="{% url 'home' %}" name="poll" method="post" enctype="multipart/form-data">
                    {% csrf_token %}
                    <div class="row">
                        <div class="col-sm-4">
                            <p>
                                <label>Poll Category</label>
                                {{ poll_form.category }}
                            </p>
                        </div>
                        <div class="col-sm-10">
                            <div class="tab-pane active" id="tab-en">
                                <p>{{ poll_form.question_en }}</p>
                            </div>
                        </div>
                        <div class="col-sm-4 col-xs-6">
                            <p>
                                <label>Rating Options</label>
                                {{ poll_form.rating_option }}
                            </p>
                        </div>
                        <div class="col-sm-4 col-xs-6">
                            <p>
                                <label>Poll Privacy</label>
                                {{ poll_form.privacy }}
                            </p>
                        </div>
                        <div class="col-sm-4 col-xs-6">
                            <p>
                                <label>Image</label>
                                {{ poll_form.image }}
                            </p>
                        </div>
                        <div class="col-sm-4 col-xs-6">
                            <p>
                                <br />
                                <button type="submit" class="btn btn-danger btn-sm " name="poll">Launch and Share</button>
                            </p>
                        </div>
                    </div>
                    </form>
                    </div>
                </div>

            </div>