How to set background image in Django template? Let's say the address of my background image is at www.randomlink.com/static/backgroundimagesplash.jpg
I looked at the Pinterest homepage. As many of you know, Pinterest was built using Django. I checked a few of their elements on my homepage.
One of the graphic elements they used was here: PinterestSplashImage.jpg
The burst image is set in the center from the bottom. One thing I noticed is that the splash image changes relative to the size of the browser in which it is viewed.
This is my current homepage template:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <link href="www.randomlink.com/static/favicon.ico" rel="icon" type="image/x-icon"> <head> <title>Homepage</title> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <style> body{ font-family:Arial,Helvetica,sans-serif; font-size: 12px; } </style> </head> <body> {{ state }} <form action="/login/" method="post"> {% if next %} <input type="hidden" name="next" value="{{ next }}" /> {% endif %} username: <input type="text" name="username" value="{{ username}}" /><br /> password: <input type="password" name="password" value="" /><br /> <input type="submit" value="Log In" /> </form> </body> </html>
How can I set www.randomlink.com/static/backgroundimagesplash.jpg in the lower center and make it accessible, as Pinterest did with its homepage? (For the sake of argument, the splash will be the same size as the Pinterest popup)
source share