django-admin自定义功能按钮样式

位置在原来的django-admin 栏中的上方【会因为屏幕大小而变换位置】

html 复制代码
 <!-- 这里是不会替换掉旧的 添加按钮 ,而是添加多一个按钮【点击Crawl Data】-->
<!-- /home/luichun/lc/Pyfile/Pywebback/app/paqu/templates/admin/yourmodel_changelist.html -->
{% extends "admin/change_list.html" %}

{% block object-tools %}
{{ block.super }}
<div class="object-tools">
    <ul class="object-tools">
        <li>
            <a href="{% url 'admin:crawl-data' %}">点击Crawl Data</a>
            <a href="{% url 'admin:crawl-data' %}" class="button">点击Crawl Data</a>
            <a href="{% url 'admin:crawl-data' %}" class="addlink">增加 crawled data</a>
            <a href="{% url 'admin:crawl-data' %}" class="addlink">增加 crawled data</a>
            <a href="{% url 'admin:crawl-data' %}" class="add-related">增加 crawled data</a>
            <a href="{% url 'admin:crawl-data' %}" style="color: white; background: linear-gradient(270deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #8b00ff); background-size: 1400% 1400%; animation: rainbow 10s ease infinite; padding: 5px 10px; border-radius: 5px; text-decoration: none;">点击Crawl Data</a>
            <a href="{% url 'admin:crawl-data' %}" style="color: white; background: linear-gradient(270deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #8b00ff); background-size: 1400% 1400%; animation: rainbow 10s ease infinite; padding: 5px 10px; border-radius: 20px; text-decoration: none;">点击Crawl Data</a>
            <a href="{% url 'admin:crawl-data' %}" style="color: white; background: linear-gradient(270deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #8b00ff); background-size: 1400% 1400%; animation: rainbow 10s ease infinite; padding: 5px 10px; border-radius: 50%; text-decoration: none;">点击Crawl Data</a>
            <a href="{% url 'admin:crawl-data' %}" class="addlink" style="color: white; background: linear-gradient(270deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #8b00ff); background-size: 1400% 1400%; animation: rainbow 10s ease infinite; padding: 5px 10px; border-radius: 20px; text-decoration: none;">点击Crawl Data</a>
            <a href="{% url 'admin:crawl-data' %}" class="add-related" style="color: white; background: linear-gradient(270deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #8b00ff); background-size: 1400% 1400%; animation: rainbow 10s ease infinite; padding: 5px 10px; border-radius: 20px; text-decoration: none;">点击Crawl Data</a>
            <style>
            @keyframes rainbow {
            0% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
            100% { background-position: 0% 50%; }
            }
            </style>
        </li>
    </ul>
</div>
{% endblock %}

<h1>Debug: Template Loaded</h1>

彩虹渐变效果--位置在原来的django-admin 栏中的下方


html 复制代码
<!-- 这里是不会替换掉旧的 添加按钮 ,而是添加多一个按钮【点击Crawl Data】-->
<!-- /home/luichun/lc/Pyfile/Pywebback/app/paqu/templates/admin/yourmodel_changelist.html -->
{% extends "admin/change_list.html" %}



{% block object-tools %}
{{ block.super }}
            <!-- <a href="{% url 'admin:crawl-data' %}" class="addlink">增加 crawled data</a> -->
            <a href="{% url 'admin:crawl-data' %}" class="addlink" style="color: white; background: linear-gradient(270deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #8b00ff); background-size: 1400% 1400%; animation: rainbow 10s ease infinite; padding: 5px 10px; border-radius: 20px; text-decoration: none; position: relative;">点击Crawl Data</a>
{% endblock %}

{% block extrahead %}
{{ block.super }}
<style>
    @keyframes rainbow {
        0% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
        100% { background-position: 0% 50%; }
    }
</style>
{% endblock %}

<h1>Debug: Template Loaded</h1>
相关推荐
Norvyn_723 分钟前
LeetCode|Day18|20. 有效的括号|Python刷题笔记
笔记·python·leetcode
chao_78941 分钟前
更灵活方便的初始化、清除方法——fixture【pytest】
服务器·自动化测试·python·pytest
心情好的小球藻1 小时前
Python应用进阶DAY9--类型注解Type Hinting
开发语言·python
都叫我大帅哥1 小时前
LangChain加载HTML内容全攻略:从入门到精通
python·langchain
惜.己1 小时前
使用python读取json数据,简单的处理成元组数组
开发语言·python·测试工具·json
都叫我大帅哥3 小时前
Python的Optional:让你的代码优雅处理“空值”危机
python
曾几何时`5 小时前
基于python和neo4j构建知识图谱医药问答系统
python·知识图谱·neo4j
写写闲篇儿7 小时前
Python+MongoDB高效开发组合
linux·python·mongodb
杭州杭州杭州8 小时前
Python笔记
开发语言·笔记·python
路人蛃10 小时前
通过国内扣子(Coze)搭建智能体并接入discord机器人
人工智能·python·ubuntu·ai·aigc·个人开发