How to use background-image css property with Django static files

Question

I know similar questions have been answered but there are no clear answers for how to do this in a linked css file, all suggest doing directly in the html file itself I have a Jobs project, with the following structure to get to the images folder:

Jobs/core/static/core/images/search.jpg

How can I set an input element's background-image property to 'search.jpg' in a css file that is referenced with <link rel="stylesheet" href="{% static 'core/css/index.css' %}" /> ? I have seen similar questions asked and all of the answers suggest things such as setting it inline on the element itself, but how can this be done in a linked css file?

Diego Vinícius · Accepted Answer · 2018-07-05 19:04:00Z

2

Django cant see or write CSS files, all your CSS that needs Django static import you should put it inline (i like to create a new html files with my inline css with static urls and than include it on my template)

<div style="background-image: url({% static 'core/images/search.jpg' %});" />

Or you can use relative paths in your css files, but this will probabily give you a headache when start to setup in production

.someClass {
   background-image: url(/static/core/images/search.jpg);
}

answered Jul 5, 2018 at 19:04

Diego Vinícius

2,2731 gold badge15 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to use background-image css property with Django static files

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related