Toggle navigation
TUTORIALS
Computers Basics
HTML
HTML5
CSS
CSS3
SEO
Bootstrap 3
Bootstrap 4
Materialize CSS
JavaScript
jQuery
Ajax
AngularJS
C - Language
Java
PHP
Python
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
QUIZ
INTERVIEW QUESTIONS
GENERAL KNOWLEDGE
CURRENT AFFAIRS
Today Current Affairs
Monthly Current Affairs
ENGLISH
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
