Background Images

Hi Ken,

We generate a lot of different classes that will help with this, in your example – groups, we add a .groups class in general to any group as well as a .group-the-title-of-a-group class.

You could use these before any other CSS to define it’s use only when they’re present.

So to target all groups you could use

.groups #my-element {
color:red;
}

Or to target only a group called Dinosaurs you could use

.group-dinosaurs #my-element {
color:red;
}

We do the same with pages too, we add the page ID to the body element page-id-number. In the screenshot that I have attached below the page ID is 51 so the class generated is .page-id-51

By using .page-id-51 before any CSS it will ensure it is only loaded on that specific page.

Hope this helps,

Kieran

Hi Rob

You can use the ID #main to target everything within the main page (except header and footer) or body to target everything.

For example

#main {
    background-color: #ff0000;
}

You can add a class before, as per my previous reply, to target only specific pages.

You can set a background image by using background image property instead of (or aswell as) the color property. See here for more information on this https://www.w3schools.com/cssref/pr_background-image.asp. W3schools has a ton of useful information on CSS if you wish to learn to more about it.

Thanks,

Kieran