Using Just 2 CSS Class Display Text On Bootsratp 5 Card When Hover
In this blog, I will show you how to show text when hovering over a bootstrap 5 card image. It is a very popular and easy thing to do.
First, you have to take 2 divs. The first div will have the image, and the second div will have text. Now if we make the position: absolute and top: 0 of the div in the text, then the text of this text will rise from its place and sit on the image. In the initial state, the text will not be seen, so the display of the card-text: none.
Since hovering on the card will show the card-text, so we have to write display: block in .card-text style
This is the end of our work. Then the rest of the work has to be customized according to the design.
Click on this link to see the demo of what I have said so far: https://codesandbox.io/s/beautiful-hellman-gcwho