程序示例精选
Python+Django生活用品商城网站前后端
如需安装运行环境或远程调试,可点击右边博主头像或昵称进入个人主页查看博主联系方式,由专业技术人员远程协助!
前言
这篇博客针对<<Python+Django生活用品商城网站前后端 >>编写代码,代码整洁,规则,易读。 学习与应用推荐首选。
文章目录
一、所需工具软件
二、使用步骤
1. 样式引入
2. 代码实现
3. 运行结果
三、在线协助
一、所需工具软件
1. Python,Pycharm
2. Django
二、使用步骤
1.样式引入
<html> <head> <meta charset="utf-8"> <meta content="width=device-width,user-scalable=no" name="viewport"> <title>login</title> <style type="text/css"> #box4{ background-color: #5ACCC9; width: 500px; height: 50px; margin:auto ; float: left; position:absolute; top: -290; left: 0; right: 0; bottom: 0; border-style:none; border-radius: 5px; } #box1{ background-color: #8C7EF3; width: 500px; height: 300px; margin:auto ; float: inline; position:relative; top: 10px; left: 0; right: 0; bottom: 0; border-style:none; border-radius: 5px; } .p1{ color: black; font-size: 20px; margin-left:20px; margin-top: 25px; font-family: microsoft yahei; font-weight: normal; text-align: left; line-height:23px; position: center; } #box2{ background-color: #8C7EF3; width: 120px; height: 250px; margin-top:20px; margin-left:70px; float: left; text-align: center; position:static; } #box3{ background-color: #8C7EF3; width: 230px; height: 250px; margin-top:20px; float: left; text-align: center; position:static; } #input0{ width: 200px; height: 30px; margin-top:20px; } #input1{ width: 100px; height: 50px; margin: 20px; font-family: microsoft yahei; font-weight: normal; font-size: 16px; } #input2{ width: 130px; height: 50px; margin: 0px; font-family: microsoft yahei; font-weight: normal; font-size: 16px; float: left; border-width: 0px; border-radius: 3px; } #pgheader1{ background: rgb(51,51,51); width: 100%; min-width: 960px; height: 35px; margin: 0px auto; width: 100%; position: relative;z-index:5; border-color: rgb(255, 255, 255); border-width: 0px; border-style: solid; } #pgheader2{ padding-top: 10px; padding-right: 0px; display: inline-block; z-index: 1000; color: rgb(255,255,255); font-size:15px; } </style> </head>
2. 代码实现
代码如下:
<body> <div style="width: 100%; display: flex; justify-content: space-between;background-color:#3FE3E1" > <a style="margin-left: 20px;padding: 10px; color: #333; text-decoration: none;">欢迎光临</a> <div style="float: right;display: flex;justify-content: right;"> <a id="loginS" style="margin-right: 20px;padding: 10px; color: #333; text-decoration: none;" href="/accounts/logout/" >当前用户名:{{user}}</a> <a style="margin-right: 20px;padding: 10px; color: #333; text-decoration: none;" href="/accounts/logout/">注销</a> <a style="margin-right: 20px;padding: 10px; color: #333; text-decoration: none;" href="/accounts/login/">登录</a> </div> </div> <!--<div style="width: 100%; display: flex; justify-content: center;">--> <!-- <table style="margin: auto;">--> <div style="display: flex;justify-content:right;width:75%;margin: 10px auto;background-color: "> <form style="margin-top: 0px;display: inline-block;" action="" method="post" enctype="multipart/form-data"> {% csrf_token %} <td ><input type="text" name="searchWeb" value=""></td> <td style="vertical-align: middle;" ><input type="submit" value="搜索"></td> <td style="vertical-align: middle;" ><input type="submit" name="displayAllWeb" value="显示所有"></td> <td style="vertical-align: middle;" ><input type="submit" name="newWeb" value="新建"></td> </form> </div> <div class="container"> <h3>文章列表</h3> <table class="table table-striped"> <thead> <tr > <th style="width: 50px">编号</th> <th style="width: 50px">类目</th> <th style="width: 100px">名称</th> <th style="width: 100px">价格(元)</th> <th style="width: 100px">浏览</th> <th style="width: 100px">编辑</th> </tr> </thead> <tbody> <tr> {% for ii in page_object %} <tr> <form style="margin-top: 0px;display: inline-block;" action="" method="post" enctype="multipart/form-data"> {% csrf_token %} <td style="vertical-align: middle;">{{ ii.id }}</td> <td style="vertical-align: middle;">{{ ii.category }}</td> <td style="vertical-align: middle;">{{ ii.usert }}</td> <td style="vertical-align: middle;"><a href="{{ ii.id }}/">{{ ii.title }}</a></td> <td style="vertical-align: middle;">{{ ii.data1 }}</td> <td style="vertical-align: middle;">{{ ii.file }}</td> <td style="vertical-align: middle;">{{ ii.file2 }}</td> <td style="vertical-align: middle;">{{ ii.file3 }}</td> <td><img src="../../media/{{ ii.img }}" width="100" height="100"></td> <td style="vertical-align: middle;">{{ ii.img2 }}</td> <td hidden><input type="text" name="itemWeb" hidden value="display"></td> <td hidden><input type="text" name="idWeb" hidden value={{ ii.id }}></td> <td style="vertical-align: middle;" ><input type="submit" value="浏览"></td> </form> <!-- <form style="margin-top: 7.2px;display: inline-block;" action="" method="post" enctype="multipart/form-data">--> <!-- {% csrf_token %}--> <!-- <td><a hidden href="{{ ii.id }}/">{{ ii.title }}</a></td>--> <!-- <td><input type="text" name="itemWeb" hidden value="modify"></td>--> <!-- <td><input type="text" name="idWeb" hidden value={{ ii.id }}></td>--> <!-- <td><input type="submit" value="编辑"></td>--> <!-- </form>--> <td style="vertical-align: middle;"><a href="{{ ii.id }}/"><input type="button" value="编辑"></a></td> </tr> {% endfor %} </tr> </tbody> </table> <!--分页***************************************分页--> {% if is_paginated %} <ul class="pagination pull-right" id="myPage"> {% endif %} {#上一页按钮开始#} {# 如果当前页有上一页#} {% if page_object.has_previous %} {# 当前页的上一页按钮正常使用#} <li class="previous"><a href="?page={{ page_object.previous_page_number }}">上一页</a></li> {% else %} {# 当前页的不存在上一页时,上一页的按钮不可用#} <li class="previous disabled"><a href="#">上一页</a></li> {% endif %} {#上一页按钮结束#} {% if data.first %} <li class="page"><a href="?page=1">1</a></li> {% endif %} {% if data.left %} {% if data.left_has_more %} <li class="page"><a href="javascript:void(0)">...</a></li> {% endif %} {% for i in data.left %} <li class="page"><a href="?page={{ i }}">{{ i }}</a></li> {% endfor %} {% endif %} <li class="page active" ><a href="javascript:void(0)"> {{ page_num }}</a></li> {% if data.right %} {% for i in data.right %} <li class="page"><a href="?page={{ i }}">{{ i }}</a></li> {% endfor %} {% if data.right_has_more %} <li class="page"><a href="javascript:void(0)">...</a></li> {% endif %} {% endif %} {% if data.last %} <li class="page"><a href="?page={{ paginator.num_pages }}">{{ paginator.num_pages }}</a> </li> {% endif %} {% if page_object.has_next %} <li class="next"><a href="?page={{ page_object.next_page_number }}">下一页</a></li> {% else %} <li class="next disabled"><a href="#">下一页</a></li> {% endif %} {# 下一页按钮结束#} <div class="btn-group"> <button type="button" class="btn btn-primary">原始</button> <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> <span class="caret"></span> <span class="sr-only">切换下拉菜单</span> </button> <ul class="dropdown-menu" role="menu" style="width: 20px"> {% for i in paginator.page_range %} <li class="page"><a href="?page={{ i }}">{{ i }}</a></li> {% endfor %} </ul> </div> </ul> </div> </body> </html>
3. 运行结果
编辑
编辑
三、在线协助:
如需安装运行环境或远程调试, 可点击右边 博主头像 或 昵称 , 进入个人主页查看博主联系方式 ,由专业技术人员远程协助!
1)远程安装运行环境,代码调试
2)Qt, C++, Python入门指导
3)界面美化
4)软件制作
博主推荐文章:python人脸识别统计人数qt窗体-CSDN博客
博主推荐文章:Python Yolov5火焰烟雾识别源码分享-CSDN博客
Python OpenCV识别行人入口进出人数统计_python识别人数-CSDN博客
个人博客主页:alicema1111的博客_CSDN博客-Python,C++,网页领域博主
博主所有文章点这里:alicema1111的博客_CSDN博客-Python,C++,网页领域博主