Published - | Updated - May 6, 2021 04:40 am
231 Views
In this article, we will show you Shoping Cart page Design Template in Bootstrap. This article will give you simple example of Shoping Cart page Design Template in Bootstrap. you will learn Shoping Cart page Design Template in Bootstrap.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 | <! DOCTYPE html> <html> <head> <title> Shopping Cart Design teamplate Using Bootstrap - Codeplaners </title> <link rel="stylesheet" type="text/css" 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.4.0/css/bootstrap.min.css"> </head> <body> <div class="container main-section"> <div class="row"> <div class="col-lg-12 pb-2"> <h2> Shopping Cart Design teamplate Using Bootstrap - Codeplaners </h2> </div> <div class="col-lg-12 pl-3 pt-3"> <table class="table table-hover border bg-white"> <thead> <tr> <th> <h4> <b> Product Details </b> </h4> </th> <th> <h4> <b> Price </b></h4> </th> <th style="width:10%;"> <h4> </b> Quantity </b> </h4> </th> <th> <h4> <b> Subtotal </b> </h4> </th> <th> <h4> <b> Action </b> </h4> </th> </tr> </thead> <tbody> <tr> <td> <div class="row"> <div class="col-lg-2 Product-img"> <img src="https://codeplaners.com/wp-content/uploads/2020/09/cropped-favicon-social-180x180.png" alt="..." class="img-responsive"/> </div> <div class="col-lg-10"> <h5 class="nomargin"> <b> Lenovo K6 Power </b> </h5> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> </div> </div> </td> <td> <strong> 50,000 </strong> </td> <td data-th="Quantity"> <b> <input type="number" class="form-control text-center" value="1"> </b> </td> <td> <strong> 50,000 </strong> </td> <td class="actions" data-th="" style="width:10%;"> <button class="btn btn-info btn-sm"> <span class="glyphicon glyphicon-shopping-cart"> </span> </button> <button class="btn btn-danger btn-sm"> <i class="fa fa-trash-o"> </i> </button> </td> </tr> <tr> <td> <div class="row"> <div class="col-lg-2 Product-img"> <img src="https://codeplaners.com/wp-content/uploads/2020/09/cropped-favicon-social-180x180.png" alt="..." class="img-responsive"/> </div> <div class="col-lg-10"> <h5 class="nomargin"> <b> Iphone 6s </b> </h5> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> </div> </div> </td> <td> <strong> 30,000 </strong> </td> <td data-th="Quantity"> <b> <input type="number" class="form-control text-center" value="1"> </b> </td> </td> <td> <strong> 30,000 </strong> </td> <td class="actions" data-th="" style="width:10%;"> <button class="btn btn-info btn-sm"> <span class="glyphicon glyphicon-shopping-cart"> </span> </button> <button class="btn btn-danger btn-sm"> <i class="fa fa-trash-o"> </i> </button> </td> </tr> <tr> <td> <div class="row"> <div class="col-lg-2 Product-img"> <img src="https://codeplaners.com/wp-content/uploads/2020/09/cropped-favicon-social-180x180.png" alt="..." class="img-responsive"> </div> <div class="col-lg-10"> <h5 class="nomargin"> <b> Lenovo K6 Power </b> </h5> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p> </div> </div> </td> <td> <strong> 50,000 </strong> </td> <td data-th="Quantity"> <b> <input type="number" class="form-control text-center" value="1"> </b> </td> </td> <td> <strong> 50,000 </strong> </td> <td class="actions" data-th="" style="width:10%;"> <button class="btn btn-info btn-sm"> <span class="glyphicon glyphicon-shopping-cart"> </span> </button> <button class="btn btn-danger btn-sm"> <i class="fa fa-trash-o"> </i> </button> </td> </tr> </tbody> <tfoot> <tr> <td> <a href="#" class="btn btn-success "> <i class="fa fa-angle-left"> </i> Continue Shopping </a> </td> <td colspan="2" class="hidden-xs"> </td> <td class="hidden-xs text-center" style="width:10%;"> <strong> Total Price : 1,30,000 </strong> </td> <td> <a href="#" class="btn btn-success btn-block"> Checkout <i class="fa fa-angle-right"> </i> </a> </td> </tr> </tfoot> </table> </div> </div> </div> </body> </html> |
