让两个按钮左右排列
要让两个按钮左右排列,你可以使用 Bootstrap 的网格系统将它们放置在同一行中。你可以将按钮放置在两个 col
中,分别占据一定的列宽。以下是你的模板代码做出的修改:
{% extends 'base.html' %} {% block content %} <div class="container mt-4"> <h1>确认退回任务</h1> <p>您正在退回以下任务:</p> <p>任务标题:{{ assignment.assign_title }}</p> <p>分派给:{{ assignment.assign_to }}</p> <p>希望完成时间:{{ assignment.assigned_time }}</p> <form method="post"> {% csrf_token %} <label for="return_reason">退回原因:</label><br> <textarea id="return_reason" name="return_reason" rows="4" cols="50" required></textarea><br> <div class="row"> <div class="col"> <button type="submit" class="btn btn-primary">确认退回</button> </div> <div class="col"> <a href="{% url 'safetyApp:inspection_assignment_list2' assignment.acceptance_id %}" class="btn btn-secondary">返回分派列表</a> </div> </div> </form> </div> {% endblock %}
这样会使两个按钮位于同一行,并且分别占据一半的宽度,以左右排列。
分类:
bootstrap
, Django+BootStrip
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 零经验选手,Compose 一天开发一款小游戏!
· 一起来玩mcp_server_sqlite,让AI帮你做增删改查!!
2023-04-24 Django4全栈进阶之路16 项目实战(用户管理):user_list.html用户列表画面设计
2023-04-24 Django4全栈进阶之路15 项目实战(用户管理):login.html登录画面设计
2023-04-24 Django4全栈进阶之路14 项目实战(用户管理):base.html基础模板设计
2023-04-24 Django4全栈进阶之路13 template模板