CSS Tutorial For Beginners | Classes & Pseudo Classes In Bricks

This CSS tutorial for beginners shows you how to use CSS Classes and Pseudo Classes in WordPress tools like Bricks Builder and GenerateBlocks.
CSS Classes or Global CSS Classes open up a world of creative possibilities and workflow enhancements.
You'll be able to work faster and be more efficient than ever with this simple method of making design changes from the most simple to site-wide changes in a matter of seconds!
If you're ready to step into the world of CSS Classes and Pseudo Classes, hit that play button and let's get started!
Bricks Builder: jo.my/bricks
GenerateBlocks Pro: jo.my/xotgcy
Take your WordPress website and skills to the next level!
► The Essential Web Designer's Documents Pack
Looking to take your web design business to the next level? The Essential Web Designers Documents collection has got you covered! With handcrafted, professionally designed documents that have generated tens of thousands in revenue, you'll have everything you need to impress clients, streamline your workflow, and boost your bottom line.
► Buy the Essential Web Designer's Documents Pack Now: links.wptuts.co.uk/ewdd
► THE TOOLS I LOVE ◄
If you like what we do and would like to support us, please consider using these affiliate links when purchasing any of the plugins covered in our tutorials. Thank you for your support.
► EXCLUSIVE WPTUTS DISCOUNTS ◄
✅ WPVivid Backup Pro: jo.my/vividpro (use WPTUTS20 for 20% off)
✅ Project Huddle: jo.my/etafyp (WPTUTS for 20% off - Exclusive)
► MY PREFERRED HOSTING PROVIDERS ◄
✅ CloudWays: jo.my/1feeng8
✅ SiteGround: jo.my/sgwptuts
► WORDPRESS VISUAL PAGE BUILDERS ◄
✅ ELEMENTOR PRO: jo.my/1s0t2s2
✅ Brizy Pro: bit.ly/2Ji97r8
✅ GenerateBlocks: jo.my/xotgcy
✅ DIVI 3 Page Builder: bit.ly/2HiiDcE
► WORDPRESS THEMES ◄
✅ GeneratePress Premium: bit.ly/2Ydn1SE
✅ Blocksy: jo.my/y67ten
✅ DIVI Theme: bit.ly/2G8JMiA
✅ Astra Pro: bit.ly/2zruoKn
► WORDPRESS TOOLS ◄
✅ SMART SLIDER 3: bit.ly/2G0G1vB
✅ CSSHERO: bit.ly/2qbrRl6
► WORDPRESS PLUGINS ◄
✅ SEOPress Pro: jo.my/seopress
► SUBSCRIBE ◄
bit.ly/2rX7rhu
► LETS CONNECT: ◄
👉 Twitter: / wptutz
👉 Facebook Group: wptuts.co.uk/facebook
SUPPORT: Our website offers additional information and perks. Please check it out! wptuts.co.uk

[@lh-vt7su]

Your tutorials are making a difference: very well worded, without irrelevant blablabla - would love to see more tutorials and more in-depth ones. Learning a lot and saving a ton of time compared to watching other CSS tutorials.

[@koreanmeals7040]

Thank you for this video! This is really helpful for a self-taught person like me.

[@davidwalls2304]

Paul, thank you for this video. I have started learning how to use classes & pseudo-classes in my design. I've started following Kevin Geary's channel lately and getting a ton of great info from his videos. Thanks again, I look forward to more Bricks & CSS/classes videos in the future.

[@NurAlam-pl4er]

Please make more CSS tutorials for bricks. Thanks.

[@inMotionFilmHD]

Hello, first of all I think your video is really great. More please :) I have a question, is it really necessary to create a separate class for each section, each container, each widget etc.? Or is it sufficient to create a class only where global changes are possible, e.g. the styling of image boxes that are used identically on several pages? Headings are already styled in the global design settings and if 2 of 20 headings are to have a different colour, I can theoretically create a class for these. The same applies to the logo or navigation, which I can style directly without a class. Or is this the wrong way? Because I think it is a lot more work to create a separate class for each element and each widget.

[@mubindidit230]

Using CSS Classes became a game changer for me. There is absolutely '0' reasons to worry when I have Class applied on to a feature list and that feature list is used thought-out the website.

[@mehdimoradi603]

Can you make more of css tutorials for bricks? It's so great

[@rassulkz4486]

Thanks

More like this!

[@mazhar_khan1986]

Hi, where can i see all these classes we create in one place? Does it create style.css somewhere in the directory?

[@gershond1545]

Hi Paul, great tutorial, very love it and i love to see more and more tutorials like this in Bricks builder.
Now for the Classes - i wonder how i add in bricks a second or third class to the first one ?? for example i have a class: "btn-cta" and i want to add a class for future using "active" (if i need to wrote this in the css it will be ".btn-cta.active" ) i don't meant for the psaudo class active ,what i meant is for adding more class to the first one ☺️ Thank you paul so much for great tutorials 🙏🏼

[@martin_kuchar]

But how to define light and dark mode variants for element ?? Thanks

[@rumpiee]

What is Brick? What program are you in?
Thank you

[@izzy_wow]

Elementor announced CSS classes a couple of weeks ago, we might have to wait a long time for that though.

[@WPTuts]

They did and I did originally mention it in the video, but cut a pile of 'fluff' out to keep things relatively short. :)

[@OJGamingYT]

As much as I love bricks, I keep forgetting they have Pseudo classes because the button isn't very obvious or in my face all the time. One time I actually legitimately forgot how to do it LOL

[@eddiejure]

Would love to know which pagebuilder most of this channels viewers use. Paul could make a poll somewhere or you guys could reply under this comment. I personally use Elementor with Unlimited Elements but looking for switching to Framer. What about you?

[@rockeygamer5163]

I am using GenerateBlocks currently. I am learning Bricks and I am targeting to use GenerateBlocks for smaller websites and Bricks for large websites.

[@martinivanov5335]

Bricks, simply the best

[@janekg4900]

Greenshift