@TOC 一、网站题目 校园班级网页设计 、我的班级网页、我的学校、校园社团、校园运动会、等网站的设计与制作。... 二、✍️网站描述 ️HTML我的班级网页设计,采用DIV+CSS布局,共有多个页面,排版整洁,内容丰富,主题鲜明,首页使用CSS排版比较丰富,色彩鲜明有活力,导航与正文字体分别设置不同字号大小...所有页面相互超链接,可到二三级页面,有多页面组成。 页面样式风格统一布局显示正常,不错乱,使用Div+Css技术。 菜单美观、醒目,二级菜单可正常弹出与跳转。...网站文件方面:网站系统文件种类包含:html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件; 网页编辑方面:网页作品代码简单,可使用任意HTML编辑软件(如:Dreamweaver...其中: (1)html文件包含:其中index.html是首页、其他html为二级页面; (2) css文件包含:css全部页面样式,文字滚动, 图片放大等; (3) js文件包含:js实现动态轮播特效
静态页面和动态页面 静态页面 纯粹的HTML文件, 简单地说当前的页面文件就存储在服务端, 我们请求的静态页面实际上就是请求对方服务器中的文件. 通过返回不同的HTML文件来完成不同请求的显示效果....动态页面和静态页面的区分绝不是指页面上的动画效果 最常见的就是各大企业网站 动态页面 动态页面是指除了HTML以外, 通过ajax在不直接刷新页面的前提下, 完成了和服务端的数据交互...., CSS和JS html和js决定了显示的内容, css决定了怎么显示....页面的渲染主要就是通过css来完成的....浏览器渲染的过程 接收到HTML文件后开始构建DOM(Doucment Object Model)树. CSS来计算DOM树各个节点的坐标, 大小等CSS属性, 开始布局.
每个插件和主题可能有自己的 CSS 和 JavaScript 内联代码或者文件,如果 CSS 和 JavaScript 内联代码或者文件一多,就开始出现了两个比较难受的问题: 前端静态文件的问题 1....分别合并成一个文件:这样就实现前端代码简洁,并且相关的文件也变少,网页加载速度也会明显变快,还是以 Sweet 主题为例,合并之后,整个页面除了 jQuery 之外,只剩下合并生成的 JS 和 CSS...激活之后,在 WordPress 后台「WPJAM」菜单下就会新增「静态文件」子菜单,点击进入: 首先勾选「合并静态文件」按钮,然后保存,当然如果有额外的脚本和样式也可以先填入,保存之后,页面就会出现当前系统将会合并那些文件和内联的代码...: 点击这里的「一键合并」按钮就可以生成唯一的 JS 和 CSS 文件了,如果文件内容,没有更新,点击该按钮是不会文件不会被提示更新的: 注册「静态文件」 从上面列表也可以看出,WPJAM「静态文件...file/value:根据上个选项,如果 file,值为文件在服务器上的路径,如果 value,值为具体的内联代码。
前言 经过前几篇的介绍,我们以及能够建立简单的网站页面,那如果嫌弃网站页面简陋,那我们就必须要为他加上样式来渲染网络页面,在Django中,我们把这些文件统称为"静态文件"。...---- 引入静态文件 -- 自定义应用的界面和风格 首先,在应用demo_app目录下创建一个名为static的目录,Django 将在该目录先查找静态文件,这种方式和 Django在demo_app...类似于管理模板文件,我们同样可以把样式文件直接放入到demo_app/static文件夹中--而不是创建另一个demo_app的子文件夹,这样做的弊端就是因为Django只会使用第一个找到的静态文件,如果你在其他应用中有一个相同名字的静态文件...所以我们需要指引Django选择正确的静态文件,最简单的方式就是把它们放入各自的命名空间,也就是把这些静态文件放入另一个与应用名相同的目录中。...add_css.png 这边只是对页面做了简单的样式改变,旨在说明Django是如何添加样式的,实际项目中样式会复杂的多!
小能手正在学习 Django,系列笔记请点此查看。 除了服务端生成的 HTML 以外,网络应用通常需要一些额外的文件——比如图片,脚本和样式表——来帮助渲染网络页面。...Django 将在该目录下查找静态文件,这种方式和 Diango 在 polls/templates/ 目录下查找 template 的方式类似。...Django 的 STATICFILES_FINDERS 设置包含了一系列的查找器,它们知道去哪里找到 static 文件。...Django 只会使用第一个找到的静态文件。如果你在 其它 应用中有一个相同名字的静态文件,Django 将无法区分它们。.../templates/polls/index.html 的文件头添加以下内容: {% load static %} <link rel="stylesheet" type="text/<em>css</em>" href
静态文件 一个网站中除了正常的html页面之外,还有相应的样式,以及js等其他的文件,我们把除了html网页外的文件称之为静态资源文件,下面我们介绍一下怎么在django中去加载静态资源文件 1.1 加载静态资源文件第...1种方法:static标签 {% load static %} 在一个网页中,不仅仅只有一个html骨架,还需要css样式文件,js执行文件以及一些图片等。...例如你的app叫做book,有一个静态文件叫做logo.jpg,那么路径为 book/static/book/logo.jpg。...那么可以在 settings.py 中添加 STATICFILES_DIRS,以后DTL就会在这个列表的路径中查找静态文件。...{% load static %} 1.2 静态资源文件的第2种加载方法:不用每次都在页面中
第4部分(表单) 编写一个简单的表单 我们更新一下在上一个教程中编写的投票详细页面的模板 ("polls/detail.html") ,让它包含一个 HTML 元素(即表单) <form...除了服务端生成的HTML以外,网络应用通常需要一些额外的文件——比如图片,脚本和样式表——来帮助渲染网络页面。在Django中,我们把这些文件统称为“静态(static)文件”。...Django 将在该目录下查找静态文件,这种方式和 Diango在polls/templates/目录下查找 template的方式类似。...Django的STATICFILES_FINDERS设置包含了一系列的查找器,它们知道去哪里找到static文件。...管理后台采用相同的目录结构管理它的静态文件。 在你刚创建的static文件夹中创建一个名为 polls的文件夹,再在polls文件夹中创建一个名为style.css的文件。
文章目录 一、静态文件 二、静态文件使用 ---- 一、静态文件 项目中的CSS、图片、js都是静态文件。一般会将静态文件放到一个单独的目录中,以方便管理。...在html页面中调用时,也需要指定静态文件的路径,Django中提供了一种解析的方式配置静态文件路径。...为了提供静态文件,需要配置两个参数: STATICFILES_DIRS存放查找静态文件的目录 STATIC_URL访问静态文件的URL前缀 示例 1) 在项目根目录下创建static目录来保存静态文件...2) 在bookmanager/settings.py中修改静态文件的两个参数为 #内部路径访问 STATIC_URL = '/static/' #告诉静态资源在哪里STATICFILES_DIRS =...app下的static文件夹查找静态文件。
目录 Django(二) 静态文件 静态文件配置及访问顺序 动态解析 request对象方法 request方法 Django连接MySQL Django(二) 静态文件 什么是静态文件?...静态文件:写好的文件不会动态改变的文件资源,比如CSS文件,Js文件,图片文件,第三方框架等····· 墨守成规的将这些文件放在自创static文件夹中,在静态文件夹中创建CSS、JS、img、others...> ps:配置静态文件完成后,那么在static文件下的文件都可以通过路径来访问到,eg:127.0.0.1:8000/static/a.txt ps:如果Django主页面不能访问了,在urls.py...static开头,如果写了接口前缀之后,下面的静态配置文件下的文件都能够访问 ''' # 静态文件配置,可以写多个,访问的顺序是从上往下依次查找 STATICFILES_DIRS = [ os.path.join...return render(request,'login.html') # GET请求返回页面 GET请求方式的方法是一样的 如何获取URL?后面的参数?
三、加载静态文件 1. 什么是静态文件 不能与服务器做动态交互的文件叫静态文件;对于 HTML 中的图片、视频、css、js 这些都属于静态文件。Django 对于这些文件有一套明确的管理机制。...如果我们只遵循 HTML 的规范去加载静态文件,在 Django 中是显示不出来的。 ? 2....四、加载静态文件综合案例 为了更好地巩固 Django 加载静态文件的知识,我们做一个小案例。学生信息管理系统的登录页面。有显示图片 logo,有用户名和密码的输入框,并且有提交按钮。...> 将以上 html 文件保存在 templates 中,在 views 中配置好方法,urls 中配置好路由,最后在 settings 中配置好静态文件路径,最后启动 Django 服务器,页面显示效果如下...登录页面案例演示 最后 本节,我们介绍了 Django 中 templates 的知识,Django 加载 HTML 方法、模板的语言的使用,以及加载静态文件的方法。
页面介绍 [2sh7dd1zkk.png] 这个页面就是我们即将开发的简易留言簿,初始页面就是这样,关于这个页面的实现是html和css搭建的,这是前端的部分,有兴趣的小伙伴自己去查找资料学习一下,这里因为只讲后端...本篇笔记所要用到的静态html页面请前往Github下载:start.html 业务逻辑介绍 用户填写信息和留言 --> 点击提交 -->数据被存储到数据库(我们可以去数据库查询的到)。...开始分析 1、将下载的start.html文件拖到前面创建的templates文件夹里,如下图:[ldz6tknuuq.png] 2、通过观察我们发现,这个页面里面把所需的css样式都写进去了,不利于我们对其样式的个性化管理...[d2itr6x2ls.png] 4、别忘了将你新建的css样式文件引入到我们的html文件里去,否则后面文件的样式可能就加载不出来呀。事实上,我们在html里面已经引入了。...项目配置流程图 刚才的流程顺序 1、把html文件导入进来; 2、通过简单的url配置来访问这个html; 3、发现找不到页面,所以我们就设置setting中DIRS路径; 4、页面可以正常显示,但css
我们知道Flask中的Web部分,是放在templates(Html文件)和static(静态文件:诸如Css、Js、Img、Fonts等)文件夹下的。那么在Django中,也是一样的。..."demo.html") 响应html页面的时候,需要使用render()函数,其第一个参数是request对象,第二个参数是你想要响应的html页面文件名称,第三个参数可以是你后端想要传递给前端页面的信息...一定要注意,这个第二个参数的html页面文件是存放在上述建立的templates文件夹下,当你使用render()函数时,解析器会根据你的html文件名称去app项目下的templates文件夹中找,所以一定要注意不要放错位置...当然还有一种情况,有人可能会问,那要是我不是在app项目下建立的templates文件夹,我是在Django项目下建立的templates文件夹,我把html文件放在那里面怎么办呢?...文件夹中查找,如果没有的话,再去按照app的注册顺序,去每一个app项目对应的templates文件夹中查找。
在 Django 中实现一个页面,需要两个步骤,第一步,创建模板 HTML 文件,第二步,修改 views.py 文件,完成视图处理函数。...[27382660-43948aa1e82e6e39.png] 接下来在 templates/menuapp 目录中新建一个 index.html 的文件,该页面就是首页的模板文件,以下为代码部分,涉及了前端相关知识点...第二步:在后续使用静态文件的地方使用 static 标签加上路径即可,例如使用 bootstrap.min.js 文件,语句为 {% static 'js/bootstrap.min.js' %}...中增加静态文件处理代码 上述步骤涉及的代码文件修改内容如下: index.html 修改完善 {% load static %} <!...7.3 Django 模板语言 --------------- 在上文使用的 {% 语句部分 %} 就是 Django 中的模板语言,模板与普通的文本文件有两个不一样的地方,模板包含变量,该变量在页面渲染网页的时候
_0 ,值为40位hex的隐藏输入框。...这些第三方库的特点也可以辅助你判断,就是需要收集与细心观察了。 必杀技:用静态文件分析 有的网站可能修改了Django的后台地址,但Django后台所使用的静态文件地址通常没有修改,也较难修改。...访问这些静态文件地址,看看内容是否是Django的这一套,就可以确定目标是否为Django: 如 https://www.leavesongs.com/static/admin/css/dashboard.css...、 http://www.lintcode.com/static/admin/css/dashboard.css 我就不罗列了。...但这个方法有个局限,如果目标网站没有使用Django自带的django-admin(未将其包含在settings.py的INSTALLED_APPS中),就没有这个静态文件了。
除了由服务器生成的HTML文件外,网页应用一般需要提供其它必要的文件 —— 比如图片文件、JavaScript脚本和CSS样式表 —— 来为用户呈现出一个完整的网站。...自定义你的应用的外观 首先在你的polls中创建一个static目录。Django将在那里查找静态文件,与Django如何polls/templates/内部的模板类似。...管理站点也为它的静态文件使用相同的目录结构。 在你刚刚创建的static目录中,创建另外一个目录polls并在它下面创建一个文件style.css。...因为AppDirectoriesFinder 静态文件查找器的工作方式,你可以通过polls/style.css在Django中访问这个静态文件,与你如何访问模板的路径类似。...我们需要告诉Django该使用其中的哪一个,最简单的方法就是为它们添加命名空间。 也就是说,将这些静态文件放进以它们所在的应用的名字命名的另外一个目录下。
3、自动化测试 按照惯例,Django 应用的测试应该写在应用的 tests.py 文件里。测试系统会自动的在所有以 tests 开头的文件里寻找并执行测试代码。...二、静态文件的引入 首先,在 polls 目录下创建一个名为 static 的目录。...Django 将在该目录下查找静态文件,这种方式和 Diango 在 polls/templates/ 目录下查找 template 的方式类似。 1、新建 css 样式 在静态文件目录下新建样式。...static/style.css li a { color: green; } 2、引入静态文件 在模板中引入静态文件。...index.html {% load static %} <link rel="stylesheet" type="text/<em>css</em>" href="{% static 'style.<em>css</em>' %}"
一、静态文件配置 默认情况下所有的html文件都放在templates文件夹内 什么是静态文件 网站所使用的提前写好的css、JS、第三方前端模块、图片都叫静态资源文件。...在Django中需要自己手动创建静态文件存放的文件夹。 在创建好文件夹后需要在settings文件内进行如下配置: ?...在进行静态文件访问测试的时候我们需要将浏览器的network设置为disabled cache(禁止浏览器使用缓存)如下图是Google浏览器的设置方法: ?...在我们的html文件中导入框架和jQuery时也要加上接口前缀(如果使用的cdn则不用)。 多个静态资源文件夹的查找顺序是从上往下一个文件一个文件查找。 ! ?...静态页面的动态绑定 当我们修改urls的路径时,html的框架中的接口前缀也需要修改,如果html文件非常多修改起来就很麻烦了,为了解决这个问题我们需要将html的静态文件进行动态绑定。
通过该操作可以使我们的静态文件会放到这个目录下。...--查找并载入静态文件static的文件夹--> 存放所有的html资源文件--> <!...---- 2.2.2 js 对象文件结构 ---- 在 html 文件的 内的 将页面渲染交给客户,调用 let ac_game = AcGame(); 创建一个 js...其中 from django.shortcuts import render 是 Django 的渲染工具,render 用来渲染 html 文件,通过 Python 来把 html 的内容写到网页上去...首先下载一些静态资源,如背景图片等: wget --output-document=自定义图片名称 图片地址 进入 /game/static/css/,打开 game.css: /*主菜单界面创建时的css
除由服务器生成的HTML文件外,网页应用一般还需要提供其它必要的文件——比如图片、JavaScript脚本和CSS样式表。这样才能为用户呈现出一个完整的网站。...Django会从这里搜索静态文件,这个和Django在polls/templates/中查找对应的模板文件的方式是一样的。...Django有一个STATICFILES_FINDERS的查找器,它会告诉Django从哪里查找静态文件。...因为根据AppDirectoriesFinder静态文件查找器的工作方式,Django会在polls/static找到polls/style.css这个静态文件,和访问模板的路径类似。...所以我们需要告诉Django该使用其中的哪一个,最简单的方法就是为它们添加命名空间。也就是将这些静态文件放进以它们所在的应用的名字命名的子目录下。
新建父本base.html页面 在templates文件夹中新建base.html,同时将前端页面org-list.html拷贝到我们的templates里面,然后把org-list.html的全部内容复制粘贴到...base.html页面中来,然后收起标签,成了下面这个样子: [v494l5cgxv.png] 然后配置静态的文件相对路径,只需要修改图中的即可: [k8m3s26nfo.png] 开始定义父本挖坑操作...js和css,但又具有各自特殊的js和css,所以修改如下: {% block custom_css %}{% endblock %} {% block custom_js %}...org-list页面的配置 1、清空 org-list.html页面的所有代码; 2、继承base页面: {% extends 'base.html' %} # 已经包含base.html的所有信息...课程机构列表页面数据显示 通过观察页面,我们确定哪些数据是动态的,哪些是静态的,动态的需要从后台来显示,静态的可以通过HTML代码直接实现:(红色为动态,蓝色为静态) [9oxm4zy0yb.png]
领取专属 10元无门槛券
手把手带您无忧上云