css – How to add more colors to elementor´s image carousel

css – How to add more colors to elementor´s image carousel

There are a few different ways this can be done, but selector isnt a real element so it may be hard to pinpoint exactly what is needed. For instance, the selector would have to be an HTML element like div.

You can:
1: look for the IDs for those images (#my-id)
or
2: look for specific class names (.my-class, the . signifies that its a class) for those images (if they are there)
3: use the pseudo-selector like first-child, last-child, nth-child

Lets look at the second option since thats closer to best practice:

  1. youll want a general CSS rule like the selector image one, but we wont have the color on it.
div img { border: 5px solid; }

// Below would be better because the above looks at ALL images in a div tag ... So that can turn into ... all images on a page.

.container-class-name img { border: 5px solid; }

All images in a div will have a solid border of 5px. Itll default to black without the next part.

  1. Now the individual images. Lets say each has a class with image-{number}, so those classes would be like image-one, image-two, etc.
.image-one { border-color: red; }
.image-two { border-color: blue; }
.image-three { border-color: yellow; }

Hex color codes are better than using browser ones like red, blue, yellow and etc. If you dont know what those are I would highly suggest reading up on them.

You have to be both very general and specific when it comes to CSS and learn where each idea needs to be used.

css – How to add more colors to elementor´s image carousel

Leave a Reply

Your email address will not be published.