"Pricing Table Example"
Bootstrap 2.3.2 Snippet by LilyLe

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <div class="span12"> <table class="table table-condensed table-hover"> <thead> <tr> <th> </th> <th>Fluid 512</th> <th>Fluid 1024</th> <th>Fluid 2048</th> <th>Fluid 4096</th> </tr> </thead> <tbody> <tr> <td>Ram</td> <td>512MB</td> <td>1024MB</td> <td>2048MB</td> <td>4096MB</td> </tr> <tr> <td>Disk Space</td> <td>25GB</td> <td>50GB</td> <td>100GB</td> <td>200GB</td> </tr> <tr> <td>CPU Cores</td> <td>1</td> <td>2</td> <td>4</td> <td>6</td> </tr> <tr> <td>Swap</td> <td>512MB</td> <td>1024MB</td> <td>1024MB</td> <td>2048MB</td> </tr> <tr> <td>Bandwidth</td> <td>200GB</td> <td>400GB</td> <td>800GB</td> <td>1600GB</td> </tr> <tr> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td>Monthly</td> <td>$16.95/month</td> <td>$32.95/month</td> <td>$64.95/month</td> <td>$128.95/month</td> </tr> <tr> <td>Quarterly</td> <td>$16.44/month</td> <td>$31.96/month</td> <td>$63.00/month</td> <td>$125.08/month</td> </tr> <tr> <td>Yearly</td> <td>$15.26/month</td> <td>$29.66/month</td> <td>$58.46/month</td> <td>$116.06/month</td> </tr> <tr> <td> </td> <td><a class="btn btn-success" href="#"><i class="icon-shopping-cart icon-white"></i> Order »</a></td> <td><a class="btn btn-success" href="#"><i class="icon-shopping-cart icon-white"></i> Order »</a></td> <td><a class="btn btn-success" href="#"><i class="icon-shopping-cart icon-white"></i> Order »</a></td> <td><a class="btn btn-success" href="#"><i class="icon-shopping-cart icon-white"></i> Order »</a></td> </tr> </tbody> </table> </div> </div> </div>

Related: See More


Questions / Comments: