Responsive Bootstrap 4 Cards Design Tutorial – web development

#bootstrapcards
#bootstrap4
#carddesign
#responsive
#bootstrap4cards
#frontendfunn

In this Responsive Card Design Using bootstrap v4 css framework tutorial, we will make us of bootstrap v 4.1.3 css framework to create a responsive card layout. we will use all the bootstrap in build css classes and utility classes and create a layout for the card which is responsive.

we begin with a container and use the bootstrap v4 gird classes and create a two columns, the first column contains image and the date and social media share icons. Images are made responsive making use of bootstrap img-fluid class which make the images responsive.we will make use of other classes ike badges and badge pills to create badges. text-white class to make the text white in color and also make use of bg-primary and bg-white classes to style the background. we will also make use of bunch of utility classes to adjust the padding and the margin on the elements.

The main purpose of this video is to make use of only bootstrap classes and use very less custom css to create a responsive card design.

Thanks For Watching.
hope you enjoyed this video. Please do watch other videos on my channel. please share and subscribe.

Web development | HTML | CSS | SCSS | javascript Tutorials
——————————————-

https://www.youtube.com/playlist?list=PLSQ4mck-bvik9o8IJGoMezRsOjqia-y36&disable_polymer=true

Social Media Icons Animations
———————————
https://www.youtube.com/playlist?list=PLSQ4mck-bvikTgpdp1xeNc9gcT5BUd5J1

Pure CSS Loaders Animations
—————————
https://www.youtube.com/playlist?list=PLSQ4mck-bvikY0wjMXA3sVJMoBRiZQyxN

Bootstrap 4.2 Tutorials
———————–
https://www.youtube.com/playlist?list=PLSQ4mck-bvikhDaOKl43lNrdcm1h0o2fw

====================================================
You can find the source code at frontendfunn website
http://www.frontendfunn.com
====================================================

*************************************************************
Facebook
https://www.facebook.com/Frontendfunn-222709251757726/

Instagram
https://www.instagram.com/frontendfunn/

Happy Coding 😀
*************************************************************

Post Author: hatefull