Django中为html页面插入背景图片的问题

最新推荐文章于 2023-04-18 16:18:29 发布
最新推荐文章于 2023-04-18 16:18:29 发布
阅读量1w 收藏 42
点赞数 16
文章标签： Django html标签 python
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44467002/article/details/97370770
版权

最近在学习django架构，遇到了图片无法插入页面的问题，后来查阅了官方文档得知我们需要把图片放入一个静态文件static中，这个文件我们可以手动创建,与templates在同级目录下（app目录下）：
在这里插入图片描述
然后，我们需要在settings.py中配置一下静态路径：

STATIC_URL='/static'
STATICFILES_DIRS=[
    os.path.join(BASE_DIR,'static')
]

至此我们就可以往html页面中添加静态文件夹下的文件了：

<body style="background-image: url({% static 'blog/images/edit.jpg' %});
        background-size:100% 200%;background-repeat:no-repeat;">

需要注意一下url的格式，使用的是相对路径，no-repeat表示图片不重复。
哦，还有一个细节忘了提，我们需要在html文档的开始位置加上
{% load static %} 来加载静态文件，不让浏览器会报错。

以上。

伯纳乌的斯坦森
关注
  • 16
    点赞
  • 踩
  • 42
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
django的html无法加载图片的问题
编程知识分享，主打前端
06-18 3万+
html的代码都是对的，但是django网页加载不出图片，wtf? 这里来给大家演示一下，应为setting.py少了东西，无法查找图片路径 STATICFILES_DIRS=( os.path.join(BASE_DIR,'static'), ) 补上这个代码 html插入图片很简单，我这里就举个栗子 {% load static %} <body background="...
十四、Django框架使用
最新发布
mChenys的博客
10-19 881
Django是劳伦斯出版集团的开发人员为开发新闻内容网站而设计出来的一个软件，它遵循MVC思想，但是有自己的一个名词，叫做MVT。Django遵循快速开发和DRY原则。Do not repeat yourself.不要自己去重复一些工作。它提供了许多有用的工具和功能，使开发者能够轻松地构建高度可拓展、安全、高性能的 Web 应用。强大的路由系统：Django 提供了易于配置和管理 URL 路由的功能，使开发者能够定义页面和应用程序的 URL 映射。
Django之设置背景图片
江西师范大学-20届-吴悠
06-07 2891
设置setting文件 template即为真实的static文件夹 STATIC_URL = '/static/' STATICFILES_DIRS = [ os.path.join(BASE_DIR, 'templates').replace('\\','/'), ] 加载static文件夹 在html文件中加上load staticfiles，写在最外面 {% load stat...
Django之在富文本编辑其中添加图片
shengweisong
04-12 4323
如何添加富文本编辑器参考点击打开链接 在上文中的config.js为： KindEditor.ready(function(K) { K.create('textarea[name=detail]',{ width:800, height:200, uploadJson: '/admin/uploa
Django添加背景图片
spiderfu的博客
07-15 3488
Django添加背景图片 style="background-image: url(../static/images/jpg.jpg)" 注意参数，backgroud弃用了，输入back会提示的 路径没有引号，注意 ./是上级目录 …/是上上级目录 找到你的图片位置，找对了，系统会提示。 背景虚化 在网上查到的背景虚化都是背景和文字都虚化了，如果大家有方法欢迎评论。 我是先把图片用ps虚化再插入到网页背景，如果没有办法可以参考一下 ...
python之django的html插入背景图片
Caiabcd的博客
03-23 4360
使用django框架对html引入背景图片时，图片无法显示，是因为django框架需要对图片设置为静态 第一步：在django的setting文件中设置如下图（此路径设置的static是和django同一等级） 第二步：在需要插入html的文件中的head中写入一下代码 {% load static %} 第三步：引用对应路径的图片 url({% static 'img/1.jpg' %}) //代表的是静态文件夹(static)下的img文件夹中的1.jpg文件 ...
django html 插入网页背景图片
jidushanzhu的博客
11-20 5471
1、setting中设置静态文件夹 STATIC_URL = '/static/' STATICFILES_DIRS=[os.path.join(BASE_DIR,'login_register/static')] 2、html网页load文件夹，并设置body格式 <head> <meta charset="UTF-8"> {% load static %} <style type="text/css"> body{ backgroun
Django 添加背景图片
热门推荐
qq_36453146的博客
09-28 1万+
Django 添加背景图片
django admin 添加自定义链接方式
09-17
为了快速定位并处理问题，我们需要在Django Admin中实现一个功能，即点击这个ID就能直接跳转到对应内容的详情页面。 解决这个问题的方法是通过自定义Django Admin的Widget、模板过滤器以及模型表单。以下是具体步骤...
Django网站开发：使用粒子效果
weixin_40181572的博客
04-18 78
访问https://vincentgarreau.com/particles.js/下载文件。
Django综述
用代码描述我眼中的世界！
04-19 1057
1入门框架思想          MVC大部分开发语言中都有MVC框架MVC框架的核心思想是：解耦降低各功能模块之间的耦合性，方便变更，更容易重构代码，最大程度上实现代码的重用m表示model，主要用于对数据库层的封装v表示view，用于向用户展示结果c表示controller，是核心，用于处理请求、获取数据、返回结果MVTDjango是一款python的web开发框架与MVC有所不同，属于MVT...
进行django中的图片插入
weixin_44202888的博客
05-21 2255
导入需要进行的模块 from django.shortcuts import render,redirect from . import models import os from movie.settings import STATICFILES_DIRS 进行路径配置 def index(request): if request.method ==‘POST’: name = request....
django之设置背景图片 CSS 拉伸 平铺
xxx_gt的博客
03-28 9675
django2.0   背景图片存在static文件夹中1、设置setting.py文件夹。STATIC_URL = '/static/' STATICFILES_DIRS = [ os.path.join(BASE_DIR, 'static'), ]2、在html文件中，加载static文件夹，加入第一行就好了。{% load staticfiles %} &lt;!DOCTYPE ht...
Django 前端插入图片
垂钓者-change
05-20 5482
文件路径 放在blog app文件夹下面的/blog/static/test.png html代码 <img src="/static/test.png" width="60" height="105" /> 修改设置文件 setting.py 加入如下代码： # 设置图片等静态文件的路径（电脑系统文件夹路径） STATICFILES_DIRS = ( "/home/wen...
Django设置html背景图片失败，出现“GET /images/2.png HTTP/1.1“ 404 2552 解决方法
Deng872347348的博客
09-21 1420
Django设置html背景图片失败，出现“GET /images/2.png HTTP/1.1“ 404 2552 解决方法
Python-Django如何插入一个章图片
henusyb的博客
06-09 1348
首先我们先建立一个static的目录（与manage.py同一级别）如图然后就就是要把配置文件里加目录在settings.py里添加下面俩行STATIC_URL = '/static/' STATICFILES_DIRS = [os.path.join(BASE_DIR, "static")]然后就可以直接使用了我是小白，被坑好多次，网上的东西各种各样，还好遇到一个学长一指点就好希望能帮包你们...
三步解决：django-文件上传之Media url并可在后台管理添加图片
wangfan741的博客
11-03 675
问题： 当开启一个项目的时候，通常会遇到文件（图片，音频等）上传的需要，最常见的比如图片的上传，用户头像，后台管理添加图片，而图片的在是数据库中的存储主要是以该文件的相对路径，在django中可以使用media_url很好的管理上传文件。 解决办法： 三步搞定： 1.在setting配置文件中配置路径 #项目中存储上传文件的根目录[暂时配置]，注意，uploads目录需要手动创建否则上传文件时报错 MEDIA_ROOT=os.path.join(BASE_DIR,"uploads") #访问上传文件的url
Django之--模板加载图片
weixin_30642305的博客
05-24 624
在使用Django加载图片时遇到了一些问题，在模板html文件中无论使用绝对路径还是当前相对路径都无法找到图片，一直报403和404的错误，后来结合官网和网上的其他资料总算是成功了，这里记下来。 参考网址： https://docs.djangoproject.com/en/2.0/howto/static-files/ Django将图片，JS，CSS等文件称作静态文件，如果你要在模板中引...
快速入门Django （网页加载图片）
qq1376725255的专栏
04-11 696
网上找了很多加载图片的方法，有bug，终于最后调试成功啦 首先创建一个和templates同级的文件夹static， 并static下创建images文件夹， 并在images文件夹中存放照片，如bk.jpg 如下： ├─static │ │ bk.jpg │ │ │ ├─css │ │ bk.jpg │ │ style.css │ │ │ └─images │...
django 调用html页面跳转页面跳转页面,Django重定向到当前页面
05-25
如果你想在 Django 中调用 HTML 页面并在页面中执行某些操作，可以通过在视图函数中使用 render 函数来实现。例如，你可以在视图函数中创建一个变量来存储 HTML 页面中的数据，并将其传递给 render 函数，这样 Django 就可以将该变量渲染到 HTML 页面中，并将结果返回给浏览器。 如果你想在 HTML 页面中跳转到另一个页面，可以使用 HTML 标签 `<a>` 或者 JavaScript 实现跳转。如果你想在 Django 视图函数中实现页面跳转，可以使用 HttpResponseRedirect 或者 redirect 函数。 下面是一个使用 HttpResponseRedirect 实现页面跳转的例子： ```python from django.http import HttpResponseRedirect def my_view(request): # 执行一些操作... # 跳转到另一个页面 return HttpResponseRedirect('/some/url/') ``` 如果你想在重定向时保留当前页面的查询参数，可以使用 reverse 函数来生成重定向 URL。例如： ```python from django.urls import reverse from django.http import HttpResponseRedirect def my_view(request): # 执行一些操作... # 生成重定向 URL url = reverse('myapp:viewname', args=[arg1, arg2]) # 跳转到另一个页面 return HttpResponseRedirect(url) ``` 在这个例子中，`reverse` 函数生成一个名为 `viewname` 的 URL，其中包含两个参数 `arg1` 和 `arg2`。然后，`HttpResponseRedirect` 函数使用生成的 URL 进行重定向。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值