Create custom graphics above titles in CSS and Elementor | Headings with custom vectors above them

Опубликовано: 05 Ноябрь 2024
на канале: CSS Express
404
7

In this tutorial, you will learn how to place custom graphics above titles using Elementor and CSS. The graphic can be a vector (svg file), shape or even an image (png or jpg file). Instead of using a separate image widget, we will create this graphic above our text using ::before pseudoelement and background-image property.

You can completely customize the size and position of your graphic using background-size and the absolute position values.

The best part is that you can use this code and apply it to a CSS class to any heading or text and that way control the settings and link to your graphics from a single place! If you decide to apply this style to multiple titles and headings on your website or change the graphics and the image link or its size and position, you can do that automatically from one place.

💻 Grab the CSS code here:
https://www.velvetmade.com/2024/02/19...

🚀 Interactive CSS Basics course for designers and non-coders:
https://www.cssgamelab.com/

👉 Get 20% off using the code VELVET20OFF at Checkout.

––––––––––––––––––––––––––––––

PURCHASE AND DOWNLOAD ELEMENTOR PRO:

https://trk.elementor.com/cssexpress

––––––––––––––––––––––––––––––

SIMPLE CUSTOM CSS AND JS PLUGIN:

To use custom CSS code with Elementor FREE, I am using the Simple Custom CSS and JS plugin for Wordpress that you can download here:

https://wordpress.org/plugins/custom-...

Have fun and thanks for watching!

If this tutorial helped you, please share or subscribe.

––––––––––––––––––––––––––––––

This video and description may contain affiliate links. If you click on a link and make a purchase, I will receive a commission from the sale. That way you are supporting my channel and allowing me to keep making videos and posts like this. I only promote products that I use, have experience with and support, such as Elementor Pro.

––––––––––––––––––––––––––––––

Have a specific problem in Elementor that you don't know how to solve with CSS? Comment below to let me know which video you would like to see next!

––––––––––––––––––––––––––––––

MUSIC:

Artist: Corbyn Kites
Track Title: Staycation

––––––––––––––––––––––––––––––