Hey Friends today we will make completely responsive ecommerce product cards using html Css & Bootstrap. If you find this tutorial useful give it a like and Subscribe for more awesome web development content. Fell free to ask any question in comments.

Boostrap Cdn link for Icons:
https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity=“sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN” crossorigin="anonymous

Boostrap Cdn link for Css:
https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-alpha1/dist/css/bootstrap.min.css

• 0:00 Intro
• 0:08 Project Showcase
• 1:11 Files for project
• 1:25 Download Bootstrap cdn icons link from description
• 1:34 Html code for whole container of product cards
• 2:21 Html code for card 1 starts
• 3:19 Html code for info section of the card
• 5:18 Html code for button of the card
• 6:08 Html code for card 2 is same as card 1 so we copy the code of card 1
• 6:15 Changes we made for card 2
• 6:38 Html code for card 3 is same as card 1 & 2 so we copy the code of card 2
• 6:52 Changes we made for card 3
• 7:29 Download Bootstrap cdn css link from description
• 7:34 Universal Css styling for all product cards
• 9:27 Css code for card 1
• 10:07 Css code for card 2
• 10:44 class name changes for card 2 & card 3 in Html
• 10:58 Css code for card 3
• 11:30 Again universal styling for all product cards
• 12:20 Final Result

#html #css #bootstrap