Halloween party ideas 2015
Bootstrap Responsif Desktop Tabel

08:02:00
A+ A- Print Email
Hello guys kami akan mengajarkan Anda cara membuat ini sederhana Bootstrap Responsif Desktop Table. Dalam tutorial ini Anda akan belajar cara membuat proyek sederhana ini. Aku akan memberitahu Anda apa yang bootstrap, "Bootstrap" juga digunakan sebagai istilah untuk membangun sistem dengan menggunakan sendiri atau lebih tepatnya, versi pendahulunya. Kami membuat aplikasi ini menggunakan script dan CSS bootstrap skrip. Ini proyek relay ke tabel data yang diberikan. Tabel terdiri dari kolom dan Nilai, masing-masing kolom memiliki data atau nilai yang merespon jika apa yang kolom yang nilai yang ditentukan. Lihat contoh kode di bawah ini.


Kode sampel
Form html

    

  1. 
<!DOCTYPE html>
    

    2. 

  2. 
<html>
    

    3. 

  3. 
<head>
    

    4. 

  4. 
    <meta charset="UTF-8">
    

    5. 

  5. 
    <title>Bootstrap Responsive Desktop Table</title>
    

    6. 

  6. 
    <link rel="stylesheet" href="css/normalize.css">
    

    7. 

  7. 
    <link rel='css/bootstrap.min.css'>
    

    8. 

  8. 
 <link rel='stylesheet prefetch' href='css/font-awesome.min.css'>
    

    9. 

  9. 
    <link rel="stylesheet" href="css/style.css">
    

    10. 

  10. 
</head>
    

    11. 

  11. 
<body class="large-screen">
    

    12. 

  12. 
<div class="container">
    

    13. 

  13. 
 <div class="wrap">
    

    14. 

  14. 
    <h1>Bootstrap Responsive Desktop Table</h1><ul>
    

    15. 

  15. 
  <div class="table-wrapper">
    

    16. 

  16. 
   <table class="table-responsive card-list-table">
    

    17. 

  17. 
    <thead>
    

    18. 

  18. 
      <tr>
    

    19. 

  19. 
     <th>Column A</th>
    

    20. 

  20. 
     <th>Column B</th>
    

    21. 

  21. 
     <th>Column C</th>
    

    22. 

  22. 
     <th>Column D</th>
    

    23. 

  23. 
     <th>Column E</th>
    

    24. 

  24. 
     <th>Column F</th>
    

    25. 

  25. 
      </tr>
    

    26. 

  26. 
    </thead>
    

    27. 

  27. 
    <tbody>
    

    28. 

  28. 
      <tr>
    

    29. 

  29. 
     <td data-title="Column A">Value 1</td>
    

    30. 

  30. 
     <td data-title="Column B">Value 2</td>
    

    31. 

  31. 
     <td data-title="Column C">Value 3</td>
    

    32. 

  32. 
     <td data-title="Column D">Value 4</td>
    

    33. 

  33. 
     <td data-title="Column E">Value 5</td>
    

    34. 

  34. 
     <td data-title="Column F">Value 6</td>
    

    35. 

  35. 
      </tr>
    

    36. 

  36. 
      <tr>
    

    37. 

  37. 
     <td data-title="Column A">Value 1</td>
    

    38. 

  38. 
     <td data-title="Column B">Value 2</td>
    

    39. 

  39. 
     <td data-title="Column C">Value 3</td>
    

    40. 

  40. 
     <td data-title="Column D">Value 4</td>
    

    41. 

  41. 
     <td data-title="Column E">Value 5</td>
    

    42. 

  42. 
     <td data-title="Column F">Value 6</td>
    

    43. 

  43. 
      </tr>
    

    44. 

  44. 
      <tr>
    

    45. 

  45. 
     <td data-title="Column A">Value 1</td>
    

    46. 

  46. 
     <td data-title="Column B">Value 2</td>
    

    47. 

  47. 
     <td data-title="Column C">Value 3</td>
    

    48. 

  48. 
     <td data-title="Column D">Value 4</td>
    

    49. 

  49. 
     <td data-title="Column E">Value 5</td>
    

    50. 

  50. 
     <td data-title="Column F">Value 6</td>
    

    51. 

  51. 
      </tr>
    

    52. 

  52. 
      <tr>
    

    53. 

  53. 
     <td data-title="Column A">Value 1</td>
    

    54. 

  54. 
     <td data-title="Column B">Value 2</td>
    

    55. 

  55. 
     <td data-title="Column C">Value 3</td>
    

    56. 

  56. 
     <td data-title="Column D">Value 4</td>
    

    57. 

  57. 
     <td data-title="Column E">Value 5</td>
    

    58. 

  58. 
     <td data-title="Column F">Value 6</td>
    

    59. 

  59. 
      </tr>
    

    60. 

  60. 
      <tr>
    

    61. 

  61. 
     <td data-title="Column A">Value 1</td>
    

    62. 

  62. 
     <td data-title="Column B">Value 2</td>
    

    63. 

  63. 
     <td data-title="Column C">Value 3</td>
    

    64. 

  64. 
     <td data-title="Column D">Value 4</td>
    

    65. 

  65. 
     <td data-title="Column E">Value 5</td>
    

    66. 

  66. 
     <td data-title="Column F">Value 6</td>
    

    67. 

  67. 
      </tr>
    

    68. 

  68. 
      <tr>
    

    69. 

  69. 
     <td data-title="Column A">Value 1</td>
    

    70. 

  70. 
     <td data-title="Column B">Value 2</td>
    

    71. 

  71. 
     <td data-title="Column C">Value 3</td>
    

    72. 

  72. 
     <td data-title="Column D">Value 4</td>
    

    73. 

  73. 
     <td data-title="Column E">Value 5</td>
    

    74. 

  74. 
     <td data-title="Column F">Value 6</td>
    

    75. 

  75. 
      </tr>
    

    76. 

  76. 
      <tr>
    

    77. 

  77. 
     <td data-title="Column A">Value 1</td>
    

    78. 

  78. 
     <td data-title="Column B">Value 2</td>
    

    79. 

  79. 
     <td data-title="Column C">Value 3</td>
    

    80. 

  80. 
     <td data-title="Column D">Value 4</td>
    

    81. 

  81. 
     <td data-title="Column E">Value 5</td>
    

    82. 

  82. 
     <td data-title="Column F">Value 6</td>
    

    83. 

  83. 
      </tr>
    

    84. 

  84. 
      <tr>
    

    85. 

  85. 
     <td data-title="Column A">Value 1</td>
    

    86. 

  86. 
     <td data-title="Column B">Value 2</td>
    

    87. 

  87. 
     <td data-title="Column C">Value 3</td>
    

    88. 

  88. 
     <td data-title="Column D">Value 4</td>
    

    89. 

  89. 
     <td data-title="Column E">Value 5</td>
    

    90. 

  90. 
     <td data-title="Column F">Value 6</td>
    

    91. 

  91. 
      </tr>
    

    92. 

  92. 
      <tr>
    

    93. 

  93. 
     <td data-title="Column A">Value 1</td>
    

    94. 

  94. 
     <td data-title="Column B">Value 2</td>
    

    95. 

  95. 
     <td data-title="Column C">Value 3</td>
    

    96. 

  96. 
     <td data-title="Column D">Value 4</td>
    

    97. 

  97. 
     <td data-title="Column E">Value 5</td>
    

    98. 

  98. 
     <td data-title="Column F">Value 6</td>
    

    99. 

  99. 
      </tr>
    

    100. 

  100. 
      <tr>
    

    101. 

  101. 
     <td data-title="Column A">Value 1</td>
    

    102. 

  102. 
     <td data-title="Column B">Value 2</td>
    

    103. 

  103. 
     <td data-title="Column C">Value 3</td>
    

    104. 

  104. 
     <td data-title="Column D">Value 4</td>
    

    105. 

  105. 
     <td data-title="Column E">Value 5</td>
    

    106. 

  106. 
     <td data-title="Column F">Value 6</td>
    

    107. 

  107. 
      </tr>
    

    108. 

  108. 
      <tr>
    

    109. 

  109. 
     <td data-title="Column A">Value 1</td>
    

    110. 

  110. 
     <td data-title="Column B">Value 2</td>
    

    111. 

  111. 
     <td data-title="Column C">Value 3</td>
    

    112. 

  112. 
     <td data-title="Column D">Value 4</td>
    

    113. 

  113. 
     <td data-title="Column E">Value 5</td>
    

    114. 

  114. 
     <td data-title="Column F">Value 6</td>
    

    115. 

  115. 
      </tr>
    

    116. 

  116. 
      <tr>
    

    117. 

  117. 
     <td data-title="Column A">Value 1</td>
    

    118. 

  118. 
     <td data-title="Column B">Value 2</td>
    

    119. 

  119. 
     <td data-title="Column C">Value 3</td>
    

    120. 

  120. 
     <td data-title="Column D">Value 4</td>
    

    121. 

  121. 
     <td data-title="Column E">Value 5</td>
    

    122. 

  122. 
     <td data-title="Column F">Value 6</td>
    

    123. 

  123. 
      </tr>
    

    124. 

  124. 
    </tbody>
    

    125. 

  125. 
   </table>
    

    126. 

  126. 
  </div>
    

    127. 

  127. 
 </div>
    

    128. 

  128. 
</div>
    

    129. 

  129. 
</body>
    

    130. 

  130. 
</html>
    

    131.


, ,

Post a Comment

Subscribe to: Post Comments (Atom)
Powered by Blogger.