Advertisement
Guest User

Untitled

a guest
Jan 10th, 2021
105
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 6.70 KB | None | 0 0
  1. <html>
  2. <head>
  3. <stlye>
  4.  
  5. .limiter {
  6.   width: 100%;
  7.   margin: 0 auto;
  8. }
  9.  
  10. .container-table100 {
  11.   width: 100%;
  12.   min-height: 100vh;
  13.   background: #c850c0;
  14.   background: -webkit-linear-gradient(45deg, #4158d0, #c850c0);
  15.   background: -o-linear-gradient(45deg, #4158d0, #c850c0);
  16.   background: -moz-linear-gradient(45deg, #4158d0, #c850c0);
  17.   background: linear-gradient(45deg, #4158d0, #c850c0);
  18.  
  19.   display: -webkit-box;
  20.   display: -webkit-flex;
  21.   display: -moz-box;
  22.   display: -ms-flexbox;
  23.   display: flex;
  24.   align-items: center;
  25.   justify-content: center;
  26.   flex-wrap: wrap;
  27.   padding: 33px 30px;
  28. }
  29.  
  30. .wrap-table100 {
  31.   width: 1170px;
  32. }
  33.  
  34. table {
  35.   border-spacing: 1;
  36.   border-collapse: collapse;
  37.   background: white;
  38.   border-radius: 10px;
  39.   overflow: hidden;
  40.   width: 100%;
  41.   margin: 0 auto;
  42.   position: relative;
  43. }
  44. table * {
  45.   position: relative;
  46. }
  47. table td, table th {
  48.   padding-left: 8px;
  49. }
  50. table thead tr {
  51.   height: 60px;
  52.   background: #36304a;
  53. }
  54. table tbody tr {
  55.   height: 50px;
  56. }
  57. table tbody tr:last-child {
  58.   border: 0;
  59. }
  60. table td, table th {
  61.   text-align: left;
  62. }
  63. table td.l, table th.l {
  64.   text-align: right;
  65. }
  66. table td.c, table th.c {
  67.   text-align: center;
  68. }
  69. table td.r, table th.r {
  70.   text-align: center;
  71. }
  72.  
  73.  
  74. .table100-head th{
  75.   font-family: OpenSans-Regular;
  76.   font-size: 18px;
  77.   color: #fff;
  78.   line-height: 1.2;
  79.   font-weight: unset;
  80. }
  81.  
  82. tbody tr:nth-child(even) {
  83.   background-color: #f5f5f5;
  84. }
  85.  
  86. tbody tr {
  87.   font-family: OpenSans-Regular;
  88.   font-size: 15px;
  89.   color: #808080;
  90.   line-height: 1.2;
  91.   font-weight: unset;
  92. }
  93.  
  94. tbody tr:hover {
  95.   color: #555555;
  96.   background-color: #f5f5f5;
  97.   cursor: pointer;
  98. }
  99.  
  100. .column1 {
  101.   width: 260px;
  102.   padding-left: 40px;
  103. }
  104.  
  105. .column2 {
  106.   width: 160px;
  107. }
  108.  
  109. .column3 {
  110.   width: 245px;
  111. }
  112.  
  113. .column4 {
  114.   width: 110px;
  115.   text-align: right;
  116. }
  117.  
  118. .column5 {
  119.   width: 170px;
  120.   text-align: right;
  121. }
  122.  
  123. .column6 {
  124.   width: 222px;
  125.   text-align: right;
  126.   padding-right: 62px;
  127. }
  128.  
  129.  
  130. </style>
  131. </head>
  132. <body>
  133.    
  134.     <div class="limiter">
  135.         <div class="container-table100">
  136.             <div class="wrap-table100">
  137.                 <div class="table100">
  138.                     <table>
  139.                         <thead>
  140.                             <tr class="table100-head">
  141.                                 <th class="column1">Date</th>
  142.                                 <th class="column2">Order ID</th>
  143.                                 <th class="column3">Name</th>
  144.                                 <th class="column4">Price</th>
  145.                                 <th class="column5">Quantity</th>
  146.                                 <th class="column6">Total</th>
  147.                             </tr>
  148.                         </thead>
  149.                         <tbody>
  150.                                 <tr>
  151.                                     <td class="column1">2017-09-29 01:22</td>
  152.                                     <td class="column2">200398</td>
  153.                                     <td class="column3">iPhone X 64Gb Grey</td>
  154.                                     <td class="column4">$999.00</td>
  155.                                     <td class="column5">1</td>
  156.                                     <td class="column6">$999.00</td>
  157.                                 </tr>
  158.                                 <tr>
  159.                                     <td class="column1">2017-09-28 05:57</td>
  160.                                     <td class="column2">200397</td>
  161.                                     <td class="column3">Samsung S8 Black</td>
  162.                                     <td class="column4">$756.00</td>
  163.                                     <td class="column5">1</td>
  164.                                     <td class="column6">$756.00</td>
  165.                                 </tr>
  166.                                 <tr>
  167.                                     <td class="column1">2017-09-26 05:57</td>
  168.                                     <td class="column2">200396</td>
  169.                                     <td class="column3">Game Console Controller</td>
  170.                                     <td class="column4">$22.00</td>
  171.                                     <td class="column5">2</td>
  172.                                     <td class="column6">$44.00</td>
  173.                                 </tr>
  174.                                 <tr>
  175.                                     <td class="column1">2017-09-25 23:06</td>
  176.                                     <td class="column2">200392</td>
  177.                                     <td class="column3">USB 3.0 Cable</td>
  178.                                     <td class="column4">$10.00</td>
  179.                                     <td class="column5">3</td>
  180.                                     <td class="column6">$30.00</td>
  181.                                 </tr>
  182.                                 <tr>
  183.                                     <td class="column1">2017-09-24 05:57</td>
  184.                                     <td class="column2">200391</td>
  185.                                     <td class="column3">Smartwatch 4.0 LTE Wifi</td>
  186.                                     <td class="column4">$199.00</td>
  187.                                     <td class="column5">6</td>
  188.                                     <td class="column6">$1494.00</td>
  189.                                 </tr>
  190.                                 <tr>
  191.                                     <td class="column1">2017-09-23 05:57</td>
  192.                                     <td class="column2">200390</td>
  193.                                     <td class="column3">Camera C430W 4k</td>
  194.                                     <td class="column4">$699.00</td>
  195.                                     <td class="column5">1</td>
  196.                                     <td class="column6">$699.00</td>
  197.                                 </tr>
  198.                                 <tr>
  199.                                     <td class="column1">2017-09-22 05:57</td>
  200.                                     <td class="column2">200389</td>
  201.                                     <td class="column3">Macbook Pro Retina 2017</td>
  202.                                     <td class="column4">$2199.00</td>
  203.                                     <td class="column5">1</td>
  204.                                     <td class="column6">$2199.00</td>
  205.                                 </tr>
  206.                                 <tr>
  207.                                     <td class="column1">2017-09-21 05:57</td>
  208.                                     <td class="column2">200388</td>
  209.                                     <td class="column3">Game Console Controller</td>
  210.                                     <td class="column4">$999.00</td>
  211.                                     <td class="column5">1</td>
  212.                                     <td class="column6">$999.00</td>
  213.                                 </tr>
  214.                                 <tr>
  215.                                     <td class="column1">2017-09-19 05:57</td>
  216.                                     <td class="column2">200387</td>
  217.                                     <td class="column3">iPhone X 64Gb Grey</td>
  218.                                     <td class="column4">$999.00</td>
  219.                                     <td class="column5">1</td>
  220.                                     <td class="column6">$999.00</td>
  221.                                 </tr>
  222.                                 <tr>
  223.                                     <td class="column1">2017-09-18 05:57</td>
  224.                                     <td class="column2">200386</td>
  225.                                     <td class="column3">iPhone X 64Gb Grey</td>
  226.                                     <td class="column4">$999.00</td>
  227.                                     <td class="column5">1</td>
  228.                                     <td class="column6">$999.00</td>
  229.                                 </tr>
  230.                                 <tr>
  231.                                     <td class="column1">2017-09-22 05:57</td>
  232.                                     <td class="column2">200389</td>
  233.                                     <td class="column3">Macbook Pro Retina 2017</td>
  234.                                     <td class="column4">$2199.00</td>
  235.                                     <td class="column5">1</td>
  236.                                     <td class="column6">$2199.00</td>
  237.                                 </tr>
  238.                                 <tr>
  239.                                     <td class="column1">2017-09-21 05:57</td>
  240.                                     <td class="column2">200388</td>
  241.                                     <td class="column3">Game Console Controller</td>
  242.                                     <td class="column4">$999.00</td>
  243.                                     <td class="column5">1</td>
  244.                                     <td class="column6">$999.00</td>
  245.                                 </tr>
  246.                                 <tr>
  247.                                     <td class="column1">2017-09-19 05:57</td>
  248.                                     <td class="column2">200387</td>
  249.                                     <td class="column3">iPhone X 64Gb Grey</td>
  250.                                     <td class="column4">$999.00</td>
  251.                                     <td class="column5">1</td>
  252.                                     <td class="column6">$999.00</td>
  253.                                 </tr>
  254.                                 <tr>
  255.                                     <td class="column1">2017-09-18 05:57</td>
  256.                                     <td class="column2">200386</td>
  257.                                     <td class="column3">iPhone X 64Gb Grey</td>
  258.                                     <td class="column4">$999.00</td>
  259.                                     <td class="column5">1</td>
  260.                                     <td class="column6">$999.00</td>
  261.                                 </tr>
  262.                                
  263.                         </tbody>
  264.                     </table>
  265.                 </div>
  266.             </div>
  267.         </div>
  268.     </div>
  269. </body>
  270. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement