CSS 背景图片不会加载 Django 2.1.2
CSS background image will not load Django 2.1.2
我正在寻求有关此问题的帮助。我已经研究到死了,我对 django 比较陌生,而且我碰壁了。我的背景图片不会从我的 CSS 文件加载。我尝试了不同的目录格式 img/image.jpg static/image.jpg 等。在过去的三个小时里,我已经阅读了尽可能多的以前的 Whosebug 帖子以及各种教程,但不幸的是没有解决问题.任何帮助将不胜感激,并在此先感谢您:)
图片目录为:static/img/forrest2.jpg
CSS目录:static/css/style.css
Error Codes:
"GET / HTTP/1.1" 200 2074
[24/Nov/2018 14:10:51] "GET /static/css/style.css HTTP/1.1" 304 0
[24/Nov/2018 14:13:28] "GET / HTTP/1.1" 200 2074
[24/Nov/2018 14:13:29] "GET /static/css/style.css HTTP/1.1" 200 1234
[24/Nov/2018 14:14:29] "GET / HTTP/1.1" 200 2074
[24/Nov/2018 14:14:29] "GET /static/css/style.css HTTP/1.1" 200 1235
CSS File:
@import url('https://fonts.googleapis.com/css?family=Open+Sans:800|Poppins:500');
html, body{
margin: 0;
padding:0;
height: 100%;
width: 100%;
}
.intro {
height: 100%;
width: 100%;
margin-auto: auto;
background-image: url('/static/img/forrest2.jpg') no-repeat 50% 50%;
background-size: cover;
/*Allows the whole image to display*/
display: table;
top: 0;
/*no top white line*/
}
Django Settings in settings.py:
STATIC_URL = '/static/'
STATIC_DIRS = 'static'
STATICFILES_DIRS = [
STATIC_DIRS,
]
我认为问题在于您正在使用 background-image
属性 将所有样式应用于背景,但 that property 仅用于显示图像本身和任何你想要的渐变效果。
您想要的是 shorthand property,它允许您添加背景属性的所有值(即 background-size
、background-position
、background-repeat
等)一行。
只需将 background-image
替换为 background
即可。
我正在寻求有关此问题的帮助。我已经研究到死了,我对 django 比较陌生,而且我碰壁了。我的背景图片不会从我的 CSS 文件加载。我尝试了不同的目录格式 img/image.jpg static/image.jpg 等。在过去的三个小时里,我已经阅读了尽可能多的以前的 Whosebug 帖子以及各种教程,但不幸的是没有解决问题.任何帮助将不胜感激,并在此先感谢您:)
图片目录为:static/img/forrest2.jpg
CSS目录:static/css/style.css
Error Codes:
"GET / HTTP/1.1" 200 2074
[24/Nov/2018 14:10:51] "GET /static/css/style.css HTTP/1.1" 304 0
[24/Nov/2018 14:13:28] "GET / HTTP/1.1" 200 2074
[24/Nov/2018 14:13:29] "GET /static/css/style.css HTTP/1.1" 200 1234
[24/Nov/2018 14:14:29] "GET / HTTP/1.1" 200 2074
[24/Nov/2018 14:14:29] "GET /static/css/style.css HTTP/1.1" 200 1235
CSS File:
@import url('https://fonts.googleapis.com/css?family=Open+Sans:800|Poppins:500');
html, body{
margin: 0;
padding:0;
height: 100%;
width: 100%;
}
.intro {
height: 100%;
width: 100%;
margin-auto: auto;
background-image: url('/static/img/forrest2.jpg') no-repeat 50% 50%;
background-size: cover;
/*Allows the whole image to display*/
display: table;
top: 0;
/*no top white line*/
}
Django Settings in settings.py:
STATIC_URL = '/static/'
STATIC_DIRS = 'static'
STATICFILES_DIRS = [
STATIC_DIRS,
]
我认为问题在于您正在使用 background-image
属性 将所有样式应用于背景,但 that property 仅用于显示图像本身和任何你想要的渐变效果。
您想要的是 shorthand property,它允许您添加背景属性的所有值(即 background-size
、background-position
、background-repeat
等)一行。
只需将 background-image
替换为 background
即可。