Bricks Builder - Card Layout Hover Effect 1 | Tutorials

Veröffentlicht am: 21 Oktober 2022
auf dem Kanal: Jornes
3,817
73

#bricksbuilder #tutorials #cardlayout #cardhovereffect #carddesign

In this video, I will show you how to design a simple card with a hover effect that applies to inner items when hovering on the card.

Let me know if there is anything I can do better in the following videos. TQ!

P/S: This is the first video that has a voiceover. I don't speak well in English as it's not my primary language(I'll improve). Hope you guys understand what I was talking about. Haha!

-- TIMESTAMPS --
00:00:00 - Intro
00:00:10 - Start Styling
00:00:35 - Creating Classes for each element
00:04:45 - Creating Pseudo-Classes for inner selectors
00:07:11 - View Card on the Front End
00:08:05 - Thank you for watching!

#basicguidesharing #howto

*If you have any requests and want me to make a video for that, please, let me know by commenting below. :)

---------------------------------------------------------

★★★ 𝗗𝗼𝘄𝗻𝗹𝗼𝗮𝗱 𝗖𝗦𝗦 𝗖𝗼𝗱𝗲 & 𝗧𝗲𝗺𝗽𝗹𝗮𝘁𝗲 𝗝𝗦𝗢𝗡 𝗙𝗶𝗹𝗲 ★★★
You can download the template's JSON file to further study how I make it.
···
► JSON File: https://jrns.co/Akiv

---------------------------------------------------------

★★★ 𝗣𝗹𝗮𝘆𝗹𝗶𝘀𝘁 𝗳𝗼𝗿 𝗕𝗿𝗶𝗰𝗸𝘀 𝗕𝘂𝗶𝗹𝗱𝗲𝗿 ★★★
► https://jrns.co/yt-bricks

★★★ Not a 𝗕𝗿𝗶𝗰𝗸𝘀 𝗕𝘂𝗶𝗹𝗱𝗲𝗿 user yet? 𝗕𝘂𝘆 𝗶𝘁 𝗡𝗼𝘄 ★★★
► https://jrns.co/bricks
*Create your website with #Bricks #Builder today

★★★ 𝗔𝗱𝗱𝗼𝗻𝘀 𝗳𝗼𝗿 𝗕𝗿𝗶𝗰𝗸𝘀 𝗕𝘂𝗶𝗹𝗱𝗲𝗿 ★★★
► PiotnetBricks: https://jrns.co/piotnetbricks
► BricksUltimate: https://jrns.co/bricksultimate
► MaxAddons: https://jrns.co/maxaddons
► BricksExtras: https://jrns.co/bricksextras

---------------------------------------------------------

☕☕ 𝗦𝘂𝗽𝗽𝗼𝗿𝘁 𝗠𝘆 𝗖𝗵𝗮𝗻𝗻𝗲𝗹 ☕☕
Buy me a coffee ► https://jrns.co/buymecoffee
Buy a product ► https://jrns.co/links

---------------------------------------------------------

★★★ 𝙍𝙚𝙘𝙤𝙢𝙢𝙚𝙣𝙙𝙚𝙙 𝙒𝙋 𝙏𝙤𝙤𝙡𝙨 𝙬𝙞𝙩𝙝 𝙀𝙭𝙘𝙡𝙪𝙨𝙞𝙫𝙚 𝘿𝙞𝙨𝙘𝙤𝙪𝙣𝙩𝙨 ★★★
𝗦𝗮𝘃𝗲 𝗠𝗼𝗿𝗲 with 𝗘𝘅𝗰𝗹𝘂𝘀𝗶𝘃𝗲 𝗗𝗶𝘀𝗰𝗼𝘂𝗻𝘁 -
► WPVivid: https://jrns.co/wpvivid ★20%
► PiotnetForms: https://jrns.co/piotnetforms ★20%
► PiotnetGrid: https://jrns.co/piotnetgrid ★10%
► PiotnetBricks: https://jrns.co/piotnetbricks ★10%
► MaxAddons: https://jrns.co/maxaddons ★10%
-
The 𝗖𝗼𝘂𝗽𝗼𝗻 𝗖𝗼𝗱𝗲 to enjoy 𝗘𝘅𝗰𝗹𝘂𝘀𝗶𝘃𝗲 𝗗𝗶𝘀𝗰𝗼𝘂𝗻𝘁 for all the products(those have ★) above.
𝗖𝗼𝘂𝗽𝗼𝗻 𝗖𝗼𝗱𝗲: ►► Jornes ◄◄
*Use the links above and the coupon code above to enjoy an exclusive discount on 𝗔𝗡𝗬 𝗣𝗹𝗮𝗻𝘀.
---
► BetterLinks: https://jrns.co/betterlinks

---------------------------------------------------------

★★★ 𝗥𝗲𝗰𝗼𝗺𝗺𝗲𝗻𝗱𝗲𝗱 𝗛𝗼𝘀𝘁𝗶𝗻𝗴 ★★★
► Hostarmada: https://jrns.co/hosting
► Interserver: https://jrns.co/hosting-demo
► Exabytes: https://jrns.co/exa-wp
*𝘌𝘹𝘢𝘣𝘺𝘵𝘦𝘴 𝘪𝘴 𝘢 𝘵𝘰𝘱 𝘸𝘦𝘣 𝘩𝘰𝘴𝘵𝘪𝘯𝘨 𝘤𝘰𝘮𝘱𝘢𝘯𝘺 𝘣𝘢𝘴𝘦𝘥 𝘪𝘯 𝘔𝘢𝘭𝘢𝘺𝘴𝘪𝘢.
--
►Tidio Live Chat & Chatbot with Exclusive Discount: https://jrns.co/tidio-exclusive
*𝘞𝘪𝘵𝘩 𝘮𝘺 𝘭𝘪𝘯𝘬 𝘧𝘰𝘳 𝘛𝘪𝘥𝘪𝘰, 𝘵𝘩𝘦 𝘧𝘪𝘳𝘴𝘵 50 𝘤𝘶𝘴𝘵𝘰𝘮𝘦𝘳𝘴 𝘤𝘢𝘯 𝘢𝘥𝘥𝘪𝘵𝘪𝘰𝘯𝘢𝘭𝘭𝘺 𝘨𝘦𝘵 20% 𝘰𝘧𝘧 𝘈𝘕𝘠 𝘴𝘶𝘣𝘴𝘤𝘳𝘪𝘱𝘵𝘪𝘰𝘯 𝘱𝘭𝘢𝘯! 𝘛𝘩𝘦 𝘥𝘪𝘴𝘤𝘰𝘶𝘯𝘵 𝘸𝘪𝘭𝘭 𝘰𝘯𝘭𝘺 𝘣𝘦 𝘢𝘱𝘱𝘭𝘪𝘦𝘥 𝘸𝘩𝘦𝘯 𝘱𝘶𝘳𝘤𝘩𝘢𝘴𝘪𝘯𝘨 𝘵𝘩𝘦 𝘱𝘭𝘢𝘯 𝘵𝘩𝘳𝘰𝘶𝘨𝘩 𝘮𝘺 𝘭𝘪𝘯𝘬.


Auf dieser Seite können Sie das Online-Video Bricks Builder - Card Layout Hover Effect 1 | Tutorials mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer Jornes 21 Oktober 2022 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 3,817 Mal angesehen und es wurde von 73 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!