Django评级之星显示

时间:2020-06-30 06:54:37

标签: css django django-templates

我是django的新手,但遇到了问题。例如,电影的等级为4,通常有5颗星,例如,我要显示4个阴影星和1个不阴影星。结果:不显示星星

Django模板

 <span class="rating">
                             {% for rating in movie.rating_set.all %}
                                {% for k, v in star_form.fields.star.choices %}
                                    {% if rating.star > 0 %}
                                    <input id="rating{{ rating.star }}" type="radio" name="star"
                                           value="{{ k }}">
                                    <label class="changed" for="rating{{ rating.star }}">{{ k }}</label>
                                    {% elif rating.star == 0 %}
                    <input id="rating{{ v }}" type="radio" name="star"
                                           value="{{ k }}">
                                    <label  for="rating{{ v }}">{{ k }}</label>
                                     {% endif %}
                                {% endfor %}
                            </span>

CSS

    .rating > label {
        position: relative;
        display: block;
        float: right;
        background: url('../images/star-off-big.png');
        background-size: 30px 30px;
    }
    
    .rating > label:before {
        display: block;
        opacity: 0;
        content: '';
        width: 30px;
        height: 30px;
        background: url('../images/star-on-big.png');
        background-size: 30px 30px;
        transition: opacity 0.2s linear;
    }
    .changed{
        position: relative;
        display: block;
        float: right;
        background: url('../images/star-on-big.png');
        background-size: 30px 30px;
    }
.rating > label:hover:before, .rating > label:hover ~ label:before, .rating:not(:hover) > :checked ~ label:before {
    opacity: 1;
}

0 个答案:

没有答案