Toggle navigation
TUTORIALS
Basics Of Computer Science
HTML
HTML5
CSS
CSS3
Bootstrap 3
Bootstrap 4
Materialize CSS
JavaScript
jQuery
Ajax
AngularJS
C - Language
Java
PHP
Python
SEO
QUIZ
INTERVIEW QUESTIONS
REFERENCES
Practice Templates
Bootstrap Templates
PHP Projects
PLUGINS
Bootstrap 3 Plugins
Bootstrap 4 Plugins
Static Menus
Responsive Menus
Dropdown
Tabs & Pills
Modal Boxes (Dialog box)
Gallery Plugins
Sliders
Buttons
Dynamic Forms
Forms
Image Effects
G K
New
CURRENT AFFAIRS
New
MORE
IPC Sections
New
School Mathematics
Blog
CODE EDITOR
New
EXECUTE
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap 3 Snippets, Bootstrap Pricing, Free Time Learning</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <style type="text/css"> .bt-price-color-one { background-color: #ff9000; } .bt-price-color-two { background-color: #730fc4; } .bt-price-color-three { background-color: #a00d00; } .bt-price-color-four { background-color: #0083ff; } .bt-padding-btm { padding-bottom: 50px; } .bt-button-color-square { color: #fff; background-color: rgba(0, 0, 0, 0.50); border: none; border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; border: 1px solid #FFF; } .bt-button-color-square:hover { color: #fff; background-color: rgba(0, 0, 0, 0.50); border: 1px solid #000; } .bt-pricing-eleven { margin-bottom: 30px; margin-top: 50px; text-align: center; box-shadow: 0 0 5px rgba(0, 0, 0, .5); color: #fff; line-height: 30px; } .bt-pricing-eleven ul { list-style: none; margin: 0; text-align:justify; padding-left: 25px; } .bt-pricing-eleven ul li { padding-top: 5px; padding-bottom: 5px; cursor: pointer; } .bt-pricing-eleven ul li i { margin-right: 5px; } .bt-pricing-eleven .price { background-color: rgba(0, 0, 0, 0.4); padding: 30px 20px 10px 20px; font-size: 45px; font-weight: 900; color: #FFFFFF; } .bt-pricing-eleven .price small { color: #FFF; display: block; font-size: 12px; margin-top: 22px; } .bt-pricing-eleven .type { background-color: #3eaa00; padding: 50px 20px; font-weight: 900; text-transform: uppercase; font-size: 22px; } .bt-pricing-eleven .pricing-footer { padding: 20px; } .bt-attached > .col-lg-4, .bt-attached > .col-lg-3, .bt-attached > .col-md-4, .bt-attached > .col-md-3, .bt-attached > .col-sm-4, .bt-attached > .col-sm-3 { padding-left: 0; padding-right: 0; } .bt-pricing-eleven.popular { margin-top: 10px; } .bt-pricing-eleven.popular .price { padding-top: 70px; } </style> <div class="container"> <div class="row bt-padding-btm bt-attached"> <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"> <div class="bt-wrapper"> <div class="bt-pricing-eleven bt-price-color-one"> <div class="price"> <div><span style="font-weight:100;">$ </span>99</div> <small>per year</small> </div> <div class="type"> Starter Plan </div> <ul> <li><i class="fa fa-telegram"></i>1 Website </li> <li><i class="fa fa-database"></i>30 GB Storage </li> <li><i class="fa fa-hourglass"></i>Unmetered bandwidth</li> <li><li> <li><li> <li><li> <li><li> <li><li> <li><li> <li><li> <li><li> </ul> <div class="pricing-footer"> <a href="#" class="btn bt-button-color-square btn-lg">ADD TO CART</a> </div> </div> </div> </div> <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"> <div class="bt-wrapper"> <div class="bt-pricing-eleven bt-price-color-two popular"> <div class="price"> <div><span style="font-weight:100;">$ </span>199</div> <small>per year</small> </div> <div class="type"> Economy Plan </div> <ul> <li><i class="fa fa-telegram"></i>1 Website </li> <li><i class="fa fa-database"></i>100 GB Storage </li> <li><i class="fa fa-hourglass"></i>Unmetered bandwidth</li> <li><i class="fa fa-envelope"></i>Free Business Email - 1st year</li> <li><i class="fa fa-globe"></i>Free domain* with annual plan</li> <li><li><li><li><li><li><li><li> </ul> <div class="pricing-footer"> <a href="#" class="btn bt-button-color-square btn-lg">ADD TO CART</a> </div> </div> </div> </div> <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"> <div class="bt-wrapper"> <div class="bt-pricing-eleven bt-price-color-three"> <div class="price"> <div><span style="font-weight:100;">$ </span>299</div> <small>per year</small> </div> <div class="type"> Deluxe Plan </div> <ul> <li><i class="fa fa-telegram"></i>Unlimited websitesºº</li> <li><i class="fa fa-database"></i>Unmetered storage</li> <li><i class="fa fa-hourglass"></i>Unmetered bandwidth</li> <li><i class="fa fa-envelope"></i>Free Business Email - 1st year</li> <li><i class="fa fa-globe"></i>Free domain* with annual plan</li> <li><li><li><li><li><li><li><li> </ul> <div class="pricing-footer"> <a href="#" class="btn bt-button-color-square btn-lg">ADD TO CART</a> </div> </div> </div> </div> <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3"> <div class="bt-wrapper"> <div class="bt-pricing-eleven bt-price-color-four"> <div class="price"> <div><span style="font-weight:100;">$ </span>499</div> <small>per year</small> </div> <div class="type"> Ultimate Plan </div> <ul> <li><i class="fa fa-telegram"></i>Unlimited websitesºº</li> <li><i class="fa fa-database"></i>Unmetered storage</li> <li><i class="fa fa-hourglass"></i>Unmetered bandwidth</li> <li><i class="fa fa-envelope"></i>Free Business Email - 1st year</li> <li><i class="fa fa-globe"></i>Free domain* with annual plan</li> <li><i class="fa fa-dashboard"></i>2X processing power & memory</li> <li><i class="fa fa-lock"></i>1-year SSL certificate.</li> </ul> <div class="pricing-footer"> <a href="#" class="btn bt-button-color-square btn-lg">ADD TO CART</a> </div> </div> </div> </div> </div> </div> </div> <script type="text/javascript"> </script> </body> </html>
×
Close
Bootstrap 3 Snippets, Bootstrap Pricing, Free Time Learning
Sample Data
