Close

Bootstrap Price Table

This is an example of a price table with hover effects, designed using HTML, CSS, and Bootstrap framework 4. The table consists of three price columns. The pricing table is given the styles of background as #fff, box-shadow as 0px 0px 25px 0px #f5f5f5, padding as 30px 40px, color as #303030, position as relative, and border-radius as 10px. The price card title has the styles of border-bottom as 1px solid #d9d9d9, padding-bottom as 5px, and text-transform as uppercase to automatically convert the text to uppercase, whereas the price label is given the styles of font-weight as 900, font-size as 62px, display as inline-table, and margin as 30px 0 20px 0. In a hover event, the pricing card changes its background color to #497cbf, font color to #fff, with a transition value of all 0.35s, and a transform value of scale(1.05, 1.05). The Read More button is given a background of background: #497cbf, border radius as 100px, and text-transform style as uppercase, which takes the styles of border as 1px solid #fff, and font color as #fff, in a hover event. Source: https://www.tolmatol.com/price-table/

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Several Related Snippets

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.