Currently, I’m using this bit of code to call a still image background instead of the video played on the regular site:
media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
html{
background: url('img/background.jpg') no-repeat center center fixed !important;
background-size: cover;
height: 100%;
}
}
I’d like to utilize a different image for each page, how do I go about achieving this?
Thanks.
If you supply a different ID for the body tag of each page, you can then target each one with a different image:
HTML:
etc…
Then, within your media query, the CSS would be: