dj鲜生-20-模版的抽离-base父模板的生产

最新推荐文章于 2024-08-26 15:13:15 发布
最新推荐文章于 2024-08-26 15:13:15 发布
阅读量276 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ifubing/article/details/101434286
版权

以index.html页作为种子来做母版（或父模板）

在这里插入图片描述

base.html页

复制index.html

起名字base.html

在这里插入图片描述

改造base.html的思路

其它页面共有的内容，就留在base.html里

其它页面个性化的内容，就在base.html中预留block块

个性的页面只需要往block块中添加内容，就可以实现

title块

在这里插入图片描述

在这里插入图片描述

通用的样式的静态化处理

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

网页顶部引入的文件块 topfiles

10-12行

在这里插入图片描述
有的页面没有

有的页面有一部分

在这里插入图片描述

有的页面有这

在这里插入图片描述

》预留一个块

哪个页面有个性化的内容，就把重写一下块里的内容

在这里插入图片描述

欢迎信息

在这里插入图片描述

详情页

在这里插入图片描述

在这里插入图片描述

除了注册，登陆页没有外

大部分都有

》做一个有默认值的块

在这里插入图片描述

没有的页面怎么办？

重新加载这个块，让块内容为空，就可以的

搜索栏

在这里插入图片描述

首页
在这里插入图片描述

详情页

在这里插入图片描述

列表页

在这里插入图片描述

另一种搜索栏

购物车

在这里插入图片描述

提交订单

在这里插入图片描述

用户中心三个页面

在这里插入图片描述

搜索栏的块 search_bar

在这里插入图片描述

主体内容

在这里插入图片描述

每个页面的主体内容都不一样

所以

》选中的删掉

删除前
在这里插入图片描述

删除后

在这里插入图片描述

版权信息

在这里插入图片描述

网页底部引入文件的块 bottomfiles

在这里插入图片描述

不是每个页面都有底部script的

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

所以在需要的地方直接填入内容就好

网页底部html元素的块 bottom

在这里插入图片描述

在这里插入图片描述

设置一个块

在这里插入图片描述

直接使用的页面

在这里插入图片描述

鲸鱼编程pyhui
关注
Django框架（七：静态文件的导入，并提取出相同的部分作为父模板来继承）
qq_41989320的博客
10-22 613
在第五篇我已经介绍了模板的继承，今天就来实际的应用一下。 我们使用伯乐在线（网页链接）来做个实例。首先可以抽取功能的源代码来做练习，比如伯乐在线的“IT职场”和“数据库”的所有源代码，个人使用抽取源代码的工具——仿站小工具。将抽取好的文件保存到本地。 然后在项目的根目录下建一个目录static，注意这个名称是固定不变的，并在下面继续建立相应的目录，如css/image/js等等， 然后将下载的...
dj鲜生-22-模板抽离-列表页详情页模板的抽离-base_detail_list
pyhui的技术博客
09-26 206
商品详情与商品列表 全部分类的样子内容是一模一样的 新建一个小父板 找到两个页相同的代码段 小父板继承base 主要的需改的就是在body区块了 共用的代码粘在body区块中 把刚选中的一样的代码 粘到body区域中 在body块中再开一个块，让这个块可以被下一级任意填充 父模板的继承关系如下： 到此为止 base.html 作为 base_detail_list作为 base_...
dj鲜生-23-模板抽离-继承的小结
pyhui的技术博客
09-26 186
父模板的继承关系如下： 到此为止 base.html 作为 base_detail_list作为 base_no_cart base_user_center
dj鲜生-21-模板抽离-用户中心的父模板页制作-二级base_no_cart与三级base_user_center
pyhui的技术博客
09-26 256
无购物车的搜索行 搜索的div有两种，一种带购物车 一种不带 完成不带购物车的父模板的创建 这些页面符合此情况 生成base_no_cart base页代码 只需要把搜索块里相关的内容进行一个替换就好 内容填充 用户中心页分析 个人中心 全部订单 收货地址 结论，用户中心的三个页面基本上是一样的 新建另一个父模板 这个父模板要继承于base no cart 完成搜索那行的数据填...
vue-cli的webpack模板项目配置文件分析
热门推荐
hongchh的博客
02-14 7万+
由于最近在vue-cli生成的webpack模板项目的基础上写一个小东西，开发过程中需要改动到build和config里面一些相关的配置，所以刚好趁此机会将所有配置文件看一遍，理一理思路，也便于以后修改配置的时候不会“太折腾”。一、文件结构本文主要分析开发（dev）和构建（build）两个过程涉及到的文件，故下面文件结构仅列出相应的内容。├─build │ ├─build.js │ ├─ch
Flask实战2问答平台-父模板抽离(登录注册界面)
Co_zy的博客
08-23 1145
我们写一个基模板,然后让其他的继承. (1)新建基模板base.html 注意5,13,53行的{%%}块<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>{% block title %}{% endblock %}知了课堂</title> <link rel="styleshee
vue-cli-webpack模板配置全解析-2
mjzhang1993的博客
10-12 1240
vue-cli webpack 模板配置解析 - 2 重要配置文件解析重要模块版本 vue-cli : 2.9.1 vue : 2.4.2 vue-router : 2.7.0 webpack : 3.6.0 其他依赖都由 vue-cli 生成 重要配置文件解析1. /build/dev-server.js 执行 npm run dev 或者 npm start 后运行的脚本 主要功能 检查 n
使用vue3+element-ui plus 快速构建后台管理模板
m0_63622279的博客
10-12 1万+
使用vue3+element-ui plus 快速构建后台管理模板，分为侧边栏，顶部栏和内容区域三个块，前两个抽离为组件，内容区域使用routerview跳转即可，组件通信使用父子组件的通信方式。element ui plus 主要使用了 container布局容器以及icon图标。
13.JS学习篇-ES6 React 项目模板
qq_34334992的博客
08-26 2688
1.项目初始化脚手架1.前端编码规范工程化（lint工具、Node CLI等）eslintstylelintcommitlintTypescriptReactVue等不同类型的前端项目下的标准的语法限制；2.相关基础功能•React前端页面展示框架；•Redux：状态管理；•：前端路由；•：支持将Redux与进行绑定；•Express服务端；•TypeScript类型检查；•Webpack打包构建工具；•BabelES6+转ES5工具；•。
dev-webpack：Webpack配置
02-05
一，如何使用（注意webpack的... 7，url-loader处理图片为base64，使用时图片必须是相对路径否则无效（一般不用） 8，外部外部配置文件（开发依赖），例如：项目用到jQuery（有供应商省略） 9，供应商（提取第三方JS
guido：适用于cmd amd react jquery sass把手开发体系结构的构建工具，内置静态资源（样式，图片）内联外链，自动化雪碧图，资源到base64，资源文件注入模板，dev服务器，自定义路由等构建，调试，打包部署功能，减少同体系开发环境的重复配置
02-02
基于webpack4的内置工具的内置工具，还内置静态资源（样式，图片）内联外链，自动化雪碧图，资源到base64，资源文件注入模板，dev服务器等生成，调试，打包部署功能，减少同体系开发环境的重复配置。 安装和使用 ...
django之七--html模板中include标签使用场景
LYX_WIN
03-01 1576
一、前言 假设一个公司A有一个网站B，且网站B有5个不同的页面分别为C1,C2,C3,C4,C5。 那么，我们在打开这5个不同页面后去查看页面的整体内容，会发现每个页面的顶部内容、底部内容都一模一样。所以我们可以尝试把这些每个页面都拥有的相同的内容单独抽离出来放在另外的html页面进行维护。 类似于python语言里面的函数概念，比如函数D1和函数D2的内部都会使用一部分有相同代码逻辑的代码块，我们把这一部分有相同代码逻辑的代码块写成函数D，然后函数D被函数D1和函数D2调用，这样就能实现代码的高效复用
uni-app多端开发
weixin_43993776的博客
11-08 1514
开场白： 要是在 vscode 书写代码， 需要添加 几个插件来支持 uni-app。
智慧建造总体策划方案（76页）.pptx
11-02
智慧建造总体策划方案（76页）
基于 Python2.7 和 PyQT4 开发的 modbus 通信采集软件
11-02
基于 Python2.7 和 PyQT4 开发的 modbus 通信采集软件，已在 windows、deepin linux 和树莓派上测试！
LLC simulink仿真《slx模型文件》
11-02
LLC simulink仿真《slx模型文件》 LLC谐振转换器是一种高效的直流-直流(DC-DC)电源转换器，因其独特的谐振特性而得名。在电力电子领域，LLC仿真对于理解和优化这种转换器的性能至关重要。Simulink是MATLAB环境下的一个强大工具，用于建立和仿真复杂系统，包括电力电子系统。 标题“LLC simulink仿真”指的是使用Simulink进行LLC谐振转换器的建模和仿真。通过Simulink，工程师可以模拟LLC转换器在不同工作条件下的行为，如负载变化、输入电压变动以及控制策略的影响。 **LLC电路的基本原理：** LLC谐振转换器结合了升压（Boost）、降压（Buck）和串联谐振（Series Resonant）三种拓扑结构的特点。它由主开关、副开关、电感、电容和二极管组成。谐振电容和电感形成谐振回路，使得开关器件能在零电压或零电流条件下切换，从而降低开关损耗并提高效率。 **仿真过程：** 在Simulink中，首先需要建立LLC转换器的模型，包括各个元件的参数设定。这包括主开关和副开关的开关频率、谐振电容和电感的值、二极管的反向恢复特性等。然后，设
krb5-devel-1.15.1-55.el7_9.i686.rpm
11-02
Centos7 el7.x86_64 官方离线安装包，安装指令为 sudo rpm -ivh krb5-devel-1.15.1-55.el7_9.i686.rpm
基于Matlab实现Stanley算法项目源码（下载即用）高分项目
11-02
基于Matlab实现Stanley算法项目源码（下载即用）高分项目，本资源中的源码都是经过本地编译过可运行的，评审分达到98分，资源项目的难度比较适中，内容都是经过助教老师审定过的能够满足学习、毕业设计、期末大作业和课程设计使用需求，如果有需要的话可以放心下载使用。 基于Matlab实现Stanley算法项目源码（下载即用）高分项目基于Matlab实现Stanley算法项目源码（下载即用）高分项目基于Matlab实现Stanley算法项目源码（下载即用）高分项目基于Matlab实现Stanley算法项目源码（下载即用）高分项目基于Matlab实现Stanley算法项目源码（下载即用）高分项目基于Matlab实现Stanley算法项目源码（下载即用）高分项目基于Matlab实现Stanley算法项目源码（下载即用）高分项目基于Matlab实现Stanley算法项目源码（下载即用）高分项目基于Matlab实现Stanley算法项目源码（下载即用）高分项目基于Matlab实现Stanley算法项目源码（下载即用）高分项目基于Matlab实现Stanley算法项目源码（下载即用）高分项目基
ruby-2.0.0.648-39.el7_9.x86_64.rpm
最新发布
11-02
Centos7 el7.x86_64 官方离线安装包，安装指令为 sudo rpm -ivh ruby-2.0.0.648-39.el7_9.x86_64.rpm
高效构建基于 umijs、electron 和 ant-design-pro 的项目模板
资源摘要信息:"基于 umijs、electron 和 ant-design-pro 的项目模板开发代码" 在当前的 IT 行业中，现代前端开发常常涉及到多种技术栈的结合使用，以达到项目需求的目的。本资源摘要将详细介绍使用 umijs、electron...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

鲸鱼编程pyhui

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值