How i can add static files (css) to django web project-CodePudding

I have tested to embedded css style into html template, but it doesn't load css files, my configure as below, could you please help assist ?

checkstatic\showstatic\templates\index.html

<!DOCTYPE html>
<meta charset="UTF-8">
<html lang="en">
    <head>
        {% load static%}
        <link rel="stylesheet" type="text/css" href="{% static 'css/mystyle.css' %}">
    </head>
    <body>
        <img src="{% static 'logo1.png' height="200" width="200"  %}" alt="">
        <h1 >hahahaha</h1>

    </body>
</html>

checkstatic\static\css\mystyle.css

.test{
    color: red;
}

my settings:

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'showstatic'
]
...
STATIC_URL = 'static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATICFILES_DIRS = [
   os.path.join(BASE_DIR, 'checkstatic/static/')
]

when i access the index site, it only apply h1 tag, it can not load red color as the css config.

CodePudding user response：

Statics are used to get and use complete files (css, images, js, etc), in your image it should be:

<img src="{% static 'logo1.png' %}" height="200" width="200"  alt="">

Leaving the properties of the img outside the static block.

CodePudding user response：

first you should create directory=> static* after then add base directory in setting:

STATICFILES_DIRS = [
BASE_DIR / 'directory_name'] // typically the name is: static_root
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR , 'media')

then: insert urls in main project

from django.conf import settings
from django.conf.urls.static import static

 static(settings.MEDIA_URL, document_root= settings.MEDIA_ROOT)

!!attention !! ==> you should insert {%load static %} at above each of html pages if you want to know more, follow https://docs.djangoproject.com/en/4.0/howto/static-files/